JavaScript 常见错误介绍和代码示例

JavaScript是一种容易上手的语言, 但是要精通该语言, 需要付出大量的努力, 时间和耐心。初学者经常犯一些众所周知的错误, 这些错误会再次出现并被它们咬住。在本文中, 我们将介绍人们常犯的一些最常见的学习错误, 并找出解决方法。这些技巧中的许多技巧将适用于JavaScript甚至Web开发之外。
区分大小写
变量和函数名称区分大小写。并且, 请记住, JavaScript中的本机javascript函数和CSS属性是camelCase。
例子：

// it should be 'Id' not 'ID' getElementById( 'lsbin' ) != getElementByID( 'lsbin' ); // 'lsbin' again does not equal 'lsbin' getElementById( 'lsbin' ) != getElementById( 'lsbin' );

错误地使用" IF"语句比较运算符
我们正在谈论" =="运算符和" ="运算符。第一个比较, 第二个为变量赋值。创建的错误取决于语言。某些语言会引发错误, 但是JavaScript实际上会评估该语句并返回true或false。
例子：

// This if statement returns false (as expected) because x is not equal to 5: var x = 0; if (x == 5); // This if statement returns true (not expected) and Assigns 5 to x: var x = 0; if (x = 5);

Java语言是松散类型的, 但switch语句中除外。在进行大小写比较时, JavaScript的类型不是宽松的。
例子：

var myVar = 5; if (myVar == '5' ){ // returns true since Javascript is loosely typed alert( 'Welcome to lsbin' ); }switch (myVar){ case '5' : // this alert will not show since the data types don't match alert('Welcome to lsbin'); }

忘记使用" this"
另一个常见的错误是忘记使用" this"。在JavaScript对象上定义的函数无法访问该JavaScript对象的属性, 并且无法使用" this"引用标识符。
例子：

// the following is incorrect:function myFunction() { var myObject = { objProperty: "lsbin welcomes you" , objMethod: function () { alert(objProperty); } }; myObject.objMethod(); } myFunction(); // the following is correct:function myFunction() { var myObject = { objProperty: "lsbin welcomes you" , objMethod: function () { alert( this .objProperty); } }; myObject.objMethod(); } myFunction();

未定义！= null
在JavaScript中, 未定义表示变量已被声明但尚未分配值, null是分配值。可以将其分配给变量, 以表示没有值。
例子：

// undefined let TestVar; console.log(TestVar); // shows undefined console.log( typeof TestVar); // shows undefined// null let TestVar = null ; console.log(TestVar); // shows null console.log( typeof TestVar); // shows object// it is clear that undefined and null are two distinct types: // undefined is a type itself (undefined) while null is an object.null === undefined // false null == undefined // true null === null // true

令人困惑的加法和串联
增加是关于加数字, 而串联是关于增加字符串。在JavaScript中, 两个操作都使用相同的" +"运算符。因此, 将数字添加为数字将产生与将数字添加为字符串不同的结果, 并且许多初学者对此感到困惑。
例子：

// the result in x is 30 var x = 5 + 25; // the result in x is '525' var x = 5 + '25' ;

不了解范围的工作原理:
初学者很难理解的一个概念是JavaScript的范围规则和闭包。函数在其父作用域中保留对变量的可见性。但是因为我们使用setTimeout延迟了执行, 所以当函数实际运行的时间到了时, 循环已经结束, 并且I变量增加到6。
注释中的自执行函数起作用, 因为它按值复制I变量, 并为每个超时函数保留一个私有副本。
例子：