原生JS容易忽略的一些细节记录

2019-11-23

1、Undefined和Null的区别：null是一个表示”无”的对象，转为数值时为0；undefined是一个表示”无”的原始值，转为数值时为NaN。
null表示”没有对象”，即该处不应该有值。典型用法是：①作为函数的参数，表示该函数的参数不是对象。②作为对象原型链的终点。undefined表示”缺少值”，就是此处应该有一个值，但是还没有定义。典型用法是：①变量被申明了，但没有赋值时，就等于undefined。②调用函数时，应该提供的参数没有提供，该参数等于undefined。③对象没有赋值的属性，该属性的值为undefined。④函数没有返回值时，默认返回为undefined。
简而言之：undefined是一个对象被声明但未初始化的（未定义的）。null是用来存放一个空的对象的，也就是被声明而且已经初始化了。

2、replace(searchValue,replaceValue)：以searchValue为匹配对象，将匹配到的第一个字符串替换为replaceValue。
例如：

<!DOCTYPE html>
<html>
<body>

<script type="text/javascript">
        var sourceString = "我是被替换的字符串，是被替换的哦";
        var replaceString = sourceString.replace("替换", "replace");
        alert(replaceString);  // 我是被replace的字符串，是被替换的哦 
</script>

</body>
</html>

如果要实现将匹配到的所有字符串都替换，可以使用replace(searchRegexp,replaceValue)的正则表达式方式来实现。
例如：

<!DOCTYPE html>
<html>
<body>

<script type="text/javascript">
        var sourceString = "我是被替换的字符串，是被替换的哦";
        var replaceString = sourceString.replace(/替换/gm, "replace"); //sourceString.replace(new RegExp("替换", "gm"), "replace");
        alert(replaceString);   // 我是被replace的字符串，是被replace的哦
</script>

</body>
</html>

3、全局变量与局部变量
全局变量：在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。生命周期是从被声明的时间开始，页面关闭后被删除。
局部变量：在函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它。（该变量的作用域是局部的）。生命周期是从被声明的时间开始，函数运行以后被删除。
注：如果把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。
例如：

1	name = "Jack";

将声明一个全局变量 name，即使它在函数内执行。
4、onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。onload 和 onunload 事件可用于处理 cookie。
例如：

<!DOCTYPE html>
<html>
<body οnlοad="checkCookies()">

<script>
function checkCookies()
{
if (navigator.cookieEnabled==true)
    {
    alert("已启用 cookie")
    }
else
    {
    alert("未启用 cookie")
    }
}
</script>

<p>提示框会告诉你，浏览器是否已启用 cookie。</p>
</body>
</html>

5、JavaScript 引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果，就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升（hoisting）。
例如：

1 2	console.log(a); var a = 1;

上面代码首先使用console.log方法，在控制台（console）显示变量a的值。这时变量a还没有声明和赋值，所以这是一种错误的做法，但是实际上不会报错。因为存在变量提升，真正运行的是下面的代码。

1
2
3

var a;
console.log(a);
a = 1;

最后的结果是显示undefined，表示变量a已声明，但还未赋值。
6、switch语句后面的表达式，与case语句后面的表示式比较运行结果时，采用的是严格相等运算符（===），而不是相等运算符（==），这意味着比较时不会发生类型转换。
例如：

var x = 1;

switch (x) {
  case true:
    console.log('x 发生类型转换');
  default:
    console.log('x 没有发生类型转换');
}
// 结果：x 没有发生类型转换

一个正在成长的前端小白~