JavaScriptのよくある間違い
この章では、JavaScriptの一般的な間違いをいくつか指摘します。
代入演算子を誤って使用する
プログラマーがifステートメントで=比較演算子（）の代わりに代入演算子（）を誤って使用した場合、JavaScriptプログラムは予期しない結果を生成する可能性があります。==
xが10に等しくないため、このifステートメントは（予想どおりに）返されます。false
let x = 0;
if (x == 10)
10が真であるため、このifステートメントはtrue（おそらく期待どおりではない）戻ります。
let x = 0;
if (x = 10)
0は偽であるため、このifステートメントはfalse（おそらく期待どおりではない）戻ります。
let x = 0;
if (x = 0)
割り当ては常に割り当ての値を返します。
ゆるい比較を期待する
通常の比較では、データ型は重要ではありません。このifステートメントはtrueを返します。
let x = 10;
let y = "10";
if (x == y)
厳密に比較すると、データ型は重要です。このifステートメントはfalseを返します。
let x = 10;
let y = "10";
if (x === y)
switchステートメントが厳密な比較を使用していることを忘れることはよくある間違いです。
これによりcase switch、アラートが表示されます。
let x = 10;
switch(x) {
case 10: alert("Hello");
}
これcase switchはアラートを表示しません：
let x = 10;
switch(x) {
case "10": alert("Hello");
}
紛らわしい加算と連結
足し算とは、数字を足すということです。
連結とは、文字列を追加することです。
JavaScriptでは、両方の操作で同じ+演算子が使用されます。
このため、数値を数値として加算すると、数値を文字列として加算した場合とは異なる結果が生成されます。
let x = 10;
x = 10 + 5; //
Now x is 15
let y = 10;
y += "5";
// Now y is "105"
2つの変数を追加する場合、結果を予測するのは難しい場合があります。
let x = 10;
let y = 5;
let z = x + y; // Now z is 15
let x = 10;
let y = "5";
let z = x + y; // Now z is "105"
フロートの誤解
JavaScriptのすべての数値は、64ビットの浮動小数点数 （Floats）として格納されます。
JavaScriptを含むすべてのプログラミング言語では、正確な浮動小数点値に問題があります。
let x = 0.1;
let y = 0.2;
let z = x + y
// the result in z will not be 0.3
上記の問題を解決するには、乗算と除算が役立ちます。
例
let z = (x * 10 + y * 10) / 10; // z will be 0.3
JavaScript文字列を壊す
JavaScriptを使用すると、ステートメントを2行に分割できます。
例1
let x =
"Hello World!";
ただし、文字列の途中でステートメントを壊しても機能しません。
例2
let x = "Hello
World!";
文字列内のステートメントを分割する必要がある場合は、「バックスラッシュ」を使用する必要があります。
例3
let x = "Hello \
World!";
セミコロンの置き忘れ
セミコロンの位置が間違っているため、このコードブロックはxの値に関係なく実行されます。
if (x == 19);
{
// code block
}
リターンステートメントを破る
行の終わりでステートメントを自動的に閉じるのは、デフォルトのJavaScriptの動作です。
このため、これら2つの例は同じ結果を返します。
例1
function myFunction(a) {
let power = 10
return a * power
}
例2
function myFunction(a) {
let power = 10;
return a * power;
}
JavaScriptでは、ステートメントを2行に分割することもできます。
このため、例3でも同じ結果が返されます。
例3
function myFunction(a) {
let
power = 10;
return a * power;
}
しかし、次のようにreturnステートメントを2行に分割するとどうなりますか。
例4
function myFunction(a) {
let
power = 10;
return
a * power;
}
関数はundefined！を返します。
どうして？JavaScriptはあなたが意味していると思ったので：
例5
function myFunction(a) {
let
power = 10;
return;
a * power;
}
説明
ステートメントが次のように不完全な場合：
let
JavaScriptは、次の行を読んでステートメントを完成させようとします。
power = 10;
しかし、このステートメントは完全なので、次のようになります。
return
JavaScriptは次のように自動的に閉じます：
return;
これは、JavaScriptではセミコロンを使用したステートメントの終了（終了）がオプションであるために発生します。
JavaScriptは、完全なステートメントであるため、行の終わりでreturnステートメントを閉じます。
returnステートメントを壊さないでください。
名前付きインデックスを使用した配列へのアクセス
多くのプログラミング言語は、名前付きインデックスを持つ配列をサポートしています。
名前付きインデックスを持つ配列は、連想配列（またはハッシュ）と呼ばれます。
JavaScriptは、名前付きインデックスを持つ配列をサポートしていません。
JavaScriptでは、配列は番号付きインデックスを使用します。
例
const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length;
// person.length will return 3
person[0];
// person[0] will return "John"
JavaScriptでは、オブジェクトは名前付きインデックスを使用します。
名前付きインデックスを使用する場合、配列にアクセスするときに、JavaScriptは配列を標準オブジェクトに再定義します。
自動再定義後、配列メソッドとプロパティは未定義または誤った結果を生成します。
例：
const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length; // person.length will
return 0
person[0];
// person[0] will return undefined
定義をコンマで終了する
オブジェクトおよび配列定義の末尾のコンマは、ECMAScript5では有効です。
オブジェクトの例：
person = {firstName:"John", lastName:"Doe", age:46,}
配列の例：
points = [40, 100, 1, 5, 25, 10,];
警告 ！！
Internet Explorer8がクラッシュします。
JSONでは末尾のコンマは使用できません。
JSON：
person = {"firstName":"John", "lastName":"Doe", "age":46}
JSON：
points = [40, 100, 1, 5, 25, 10];
未定義はNullではありません
JavaScriptオブジェクト、変数、プロパティ、およびメソッドはundefined。
さらに、空のJavaScriptオブジェクトは値をとることができますnull。
これにより、オブジェクトが空であるかどうかをテストするのが少し難しくなる可能性があります。
You can test if an object exists by testing if the type is undefined:
Example:
if (typeof myObj === "undefined")
But you cannot test if an object is null, because this will throw an error if the
object is undefined:
Incorrect:
if (myObj === null)
To solve this problem, you must test if an object is not null,
and not undefined.
But this can still throw an error:
Incorrect:
if (myObj !== null && typeof myObj
!== "undefined")
Because of this, you must test for not undefined before you can
test for not null:
Correct:
if (typeof myObj !== "undefined" && myObj !== null)