Javascript 难点易错点总结（一）

最新推荐文章于 2023-08-22 19:00:16 发布

原创最新推荐文章于 2023-08-22 19:00:16 发布 · 546 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

Javascript 专栏收录该内容

2 篇文章

订阅专栏

本文深入讲解JavaScript中的关键概念，包括分号使用规范、字符串换行技巧、undefined与null的区别及应用、变量作用域与生命周期、NaN特性及判断方法、document.write的正确使用场景、数字与字符串相加的行为、以及HTML事件属性的大小写敏感性等问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、分号作为语句的结束标记是可选的，直接回车解析器仍然能够正常识别（不推荐省略，无法像Python那样强制优雅格式还是老老实实的加上分号）：

var str = "Hello"
alert(str)

2、可以在使用反斜杠将字符串换行，增强代码的可视性：

document.write("Hello \
World!");

3、undefined 和 null 的区别与联系：这两个都是标准的Javascript数据类型（String，Number，Boolean， Array，Object，Null，Undefined）。null和其它语言的用法类似，表示没有对象，算数运算时会被转换为0，容易混淆，不确定是变量未定义、被赋值为null、还是本身值就是0。所以增加了undefined类型，表示缺少值，算数运算不会被转换为0，而是NaN。没有混淆的情况下这两个数据类型可以互换使用，具体可以参考下面的语句：

var foo; // undefined
typeof(foo) === "undefined"; // true
undefined == null; // true
undefined === null; // false
null + 8; // 8
undefined + 8; // NaN (Not a Number)

4、以下示例最后foo的值不是undefined，而是8，原因：Javascript引擎会先遍历一遍代码找到所有的定义语句，分配内存空间，然后回来找赋值语句进行赋值，这次会忽略掉var foo;这个定义语句，所以foo的值不会被改变，除非第二个这样写var foo = undefined;，示例如下：

var foo =8;
var foo; // 8

5、NaN是number类型的全局属性，和Number.NaN等效，表示非数字，但是不能用NaN来判断非数字，因为NaN和NaN也是不相等的，应该使用isNaN函数示例如下：

typeof(NaN); // number
NaN == NaN; // false
isNaN("Hello"); // true

6、document.write要在文档加载完毕后使用，否则会覆盖整个文档，这时会发现页面被清空了，只输出了document.write输出的内容：

（1）正常的情况：

<script>
document.write("Hello");
</script>
<body>
这里的内容和上面的代码同时加载，都会正常显示！！
</body>

结果：

Hello 这里的内容和上面的代码同时加载，都会正常显示！！

（2）错误的情况：

点击后面的按钮这里的内容就看不到了！！
<button onclick="test()">点击这里</button>
<script>
function test() {
    document.write("Hello");
}
</script>

结果：

Hello

7、数字和字符串相加，无论顺序如何，数字都会被转换为字符串：

"8" + 8; // 88
8 + "8"; // 88
parseInt("8") + 8; // 16

8、函数内部的变量，如果没有使用var声明仍然是全局变量，生命周期直到页面关闭：

function test() {
    var num = 5;
    age = 8;
    return age + num;
}
test();
console.log(num); // Uncaught ReferenceError: num is not defined
console.log(age) ; // 8

9、HTML中onClick和onclick到底哪种写法是正确的？答案：都对。因为HTML的属性不区分大小写，所以无奈轮onclick哪个字母大小写都不影响结果。

10、刷新或离开网页提示（兼容chrome版，不过提示文字被chrome忽略，使用了自建的提示内容）:

window.onbeforeunload = function() {
    return "确定要离开吗";
};

或

window.onbeforeunload = function(event) {
    event.returnValue = "确定要离开吗";
};

当然，也可以直接在body里面添加属性：

<script>
function leave() {
    return "确定要离开吗";
}
</script>
<body onbeforeunload="return leave()"></body>