関数を定義する
JavaScriptでは、関数は次のように定義される。
function abs(x) {
if (x >= 0) {
return x;
} else {
return -x;
}
}
上記のabs()関数の定義は次のとおりです。
functionは関数を定義することを示す。
absは関数の名前です。
(x)のxは関数のパラメーターであり、複数のパラメーターは[,]で区切られている。
{...}の間のコードは関数本体であり、複数のコードを含める。
要注意：関数本体内のステートメントが実行される時、returnが実行されると、関数が実行完了、結果が返される。 したがって、条件付きの判断とループにより、関数内に非常に複雑なロジックが実装できる。
returnステートメントがない場合、関数は実行後に結果も返しますが、結果はundefinedです。
JavaScript関数もオブジェクトであるため、上記で定義したabs()関数は関数オブジェクトであり、関数名absは関数を指す変数と見られる。
したがって、関数を定義する2番目の方法は次のとおりです。
var abs = function (x) {
if (x >= 0) {
return x;
} else {
return -x;
}
};
このように、function(x){...}は無名関数であり、関数名はありません。 ただし、この無名関数は変数absに割り当てられているため、変数absを介して関数を呼び出すことができる。
上記の2つの定義は完全に同じです。
関数を呼び出す
関数を呼び出す時に、パラメーターを順序で渡す。
abs(10); // 10を返す
abs(-8); // 8を返す
定義されているよりも少ないパラメータを渡しても問題はありません。
abs(); // NaNを返す
この時点、abs(x)関数のパラメーターxはundefined受信され、結果はNaNです。
変数のスコープ
JavaScriptでは、var宣言された変数はスコープされる。
変数が関数本体の内部で宣言されている場合、変数のスコープは関数本体全体であり、変数を関数の外部で参照することはできません。
function foo() {
var x = 1;
x = x + 1;
}
x = x + 2; // ReferenceError! 関数の外部で変数xを参照できません
2つの異なる関数が同じ変数を宣言する場合、その変数はそれぞれの関数の本体内でのみ機能する。つまり、異なる関数内の同じ名前の変数は互いに独立しており、互いに影響を与えません。
function foo() {
var x = 1;
x = x + 1;
}
function bar() {
var x = 'A';
x = x + 'B';
}
JavaScript関数はネスト(関数内関数)できるため、この時点で、内部関数は外部関数に定義された変数にアクセスできますが、その逆はできません。
function foo() {
var x = 1;
function bar() {
var y = x + 1; // barはfooの変数xにアクセスできる
}
var z = y + 1; // ReferenceError! fooはbarの変数yにアクセスできません
}
内部関数と外部関数の変数名が同じ名前の場合はどうなりますか？それをテストしてみましょう：
function foo() {
var x = 1;
function bar() {
var x = 'A';
console.log('x in bar() = ' + x); // 'A'
}
console.log('x in foo() = ' + x); // 1
bar();
}
foo();
// 結果：
// x in foo() = 1
// x in bar() = A
これは、JavaScript関数が変数を探すときに独自の関数の定義から始まり、「内部」から「外部」まで検索することを示している。内部関数が外部関数と同じ名前の変数を定義している場合、内部関数の変数は外部関数の変数をシールドする。
'el' is defined but never used no-unused-vars...の解決方法。
Vue.jsでVue CLIを使った環境で学習していて、
npm run serveでサーバー立ち上げた際に問題が起こりました。
kushiyama_makoto@MakotonoMacBook-Air udemy-vuejs4 % npm run serve
> udemy-vuejs4@0.1.0 serve
> vue-cli-service serve
INFO Starting development server...
98% after emitting CopyPlugin
ERROR Failed to compile with 1 error 14:40:38
error in ./src/App.vue
Module Error (from ./node_modules/eslint-loader/index.js):
/Users/kushiyama_makoto/udemy-vuejs4/src/App.vue
75:19 error 'el' is defined but never used no-unused-vars
89:18 error 'el' is defined but never used no-unused-vars
92:22 error 'el' is defined but never used no-unused-vars
95:19 error 'el' is defined but never used no-unused-vars
109:18 error 'el' is defined but never used no-unused-vars
112:22 error 'el' is defined but never used no-unused-vars
119:1 error Irregular whitespace not allowed no-irregular-whitespace
✖ 7 problems (7 errors, 0 warnings)
@ ./src/main.js 6:0-28 10:13-16
@ multi (webpack)-dev-server/client?http://192.168.11.4:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
「elが定義されてるけど、一度も使用されてない？？？」
ちょっとよくわからないので、しばらくググってましたが時間だけが過ぎました。（土日だけ勉強に当ててるので、１週間くらいかかりました。意味わからんくて寝込みました。）
ただある日、記事にたどり着いいたので紹介します。こちらです。
https://qiita.com/Nelson605/items/8b1a4cefef7a84a0dec0
こちらに記述されている部分のどこかのファイルに記述するのかな（おそらくjsonファイルかな）。。。
さらにこちらのstackOverFlowの記事にさらに細かくありました！！
https://stackoverflow.com/questions/61874994/vue-disable-no-unused-vars-error-the-simplest-fix
やはりpakage.jsonに追記するみたいです。
実際に追加しました。
動いた！！！
因みに、このような記事もありました。
https://qiita.com/blajir/items/82127aaa57e4d73a8389
原因は、
JavaScriptの構文チェックツールが動いたからですかね。
なので、今回の対応はチェックツールのno-unused-varsを無効することによってエラーを解消したようです。
'el' is defined but never used no-unused-vars...のエラー解決方法。
Vue.jsでVue CLIを使った環境で学習していて、
npm run serveでサーバー立ち上げた際に問題が起こりました。
kushiyama_makoto@MakotonoMacBook-Air udemy-vuejs4 % npm run serve
> udemy-vuejs4@0.1.0 serve
> vue-cli-service serve
INFO Starting development server...
98% after emitting CopyPlugin
ERROR Failed to compile with 1 error 14:40:38
error in ./src/App.vue
Module Error (from ./node_modules/eslint-loader/index.js):
/Users/kushiyama_makoto/udemy-vuejs4/src/App.vue
75:19 error 'el' is defined but never used no-unused-vars
89:18 error 'el' is defined but never used no-unused-vars
92:22 error 'el' is defined but never used no-unused-vars
95:19 error 'el' is defined but never used no-unused-vars
109:18 error 'el' is defined but never used no-unused-vars
112:22 error 'el' is defined but never used no-unused-vars
119:1 error Irregular whitespace not allowed no-irregular-whitespace
✖ 7 problems (7 errors, 0 warnings)
@ ./src/main.js 6:0-28 10:13-16
@ multi (webpack)-dev-server/client?http://192.168.11.4:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
「elが定義されてるけど、一度も使用されてない？？？」
ちょっとよくわからないので、しばらくググってましたが時間だけが過ぎました。（土日だけ勉強に当ててるので、１週間くらいかかりました。意味わからんくて寝込みました。）
ただある日、記事にたどり着いいたので紹介します。こちらです。
https://qiita.com/Nelson605/items/8b1a4cefef7a84a0dec0
こちらに記述されている部分のどこかのファイルに記述するのかな（おそらくjsonファイルかな）。。。
さらにこちらのstackOverFlowの記事にさらに細かくありました！！
https://stackoverflow.com/questions/61874994/vue-disable-no-unused-vars-error-the-simplest-fix
やはりpakage.jsonに追記するみたいです。
実際に追加しました。
動いた！！！
因みに、このような記事もありました。
https://qiita.com/blajir/items/82127aaa57e4d73a8389
原因は、
JavaScriptの構文チェックツールが動いたからですかね。
なので、今回の対応はチェックツールのno-unused-varsを無効することによってエラーを解消したようです。
※追記
普通にpackage.jsonにrulesの項目あるのでここ（下記のスクショ）に追加でよかったみたいです。。。。
