JavaScript严格模式(use strict)是什么 如何开启严格模式

一、什么是严格模式?

JavaScript 除了提供正常模式外，还提供了严格模式（strict mode）。ES5 的严格模式是采用具有限制性 JavaScript 变体的一种方式，即在严格的条件下运行 JS 代码。严格模式在 IE10 以上版本的浏览器中才会被支持，旧版本浏览器中会被忽略。

格模式对正常的 JavaScript 语义做了一些更改：

• 消除了 Javascript 语法的一些不合理、不严谨之处，减少了一些怪异行为。
• 消除代码运行的一些不安全之处，保证代码运行的安全。
• 提高编译器效率，增加运行速度。
• 禁用了在 ECMAScript 的未来版本中可能会定义的一些语法，为未来新版本的 Javascript 做好铺垫。比如一些保留字如：class, enum, export, extends, import, super 不能做变量名。

二、开启严格模式

1、为脚本开启严格模式

为整个脚本文件开启严格模式，需要在所有语句之前放一个特定语句“use strict”;（或‘use strict’;）。

如下：

"use strict";
console.log("这是严格模式。");

当我们给整个script标签添加了下述语句后，就意味着在该标签内，即整个脚本文件中开启了严格模式。但是，要注意的是：因为"use strict"加了引号，所以老版本的浏览器(IE10以前）会把它当作一行普通字符串而忽略。

而且为了防止变量污染，就可以在script标签内部加一个立即执行函数，然后将所有的脚本放入该函数中，就相当于为整个脚本开启一个独立的作用域空间，然后为其开启严格模式，代码如下：

(function(){
    'use strict';
})()

2、为函数开启严格模式

要给某个函数开启严格模式，需要把“use strict”; (或 'use strict';) 声明放在函数体所有语句之前。

例如现在有两个函数，但是我们只想给第一个函数加严格模式，可以进行如下操作：

function f1(){
    'use strict';
}
function f2(){
            
}

只需要将严格模式的执行语句添加给第一个函数就可以实现了。

三、 严格模式中的变化

严格模式对 Javascript 的语法和行为，都做了一些改变。

1. 变量规定

(1) 在正常模式中，如果一个变量没有声明就赋值，默认是全局变量。严格模式禁止这种用法，变量都必须先用var 命令声明，然后再使用。

例如现在有一个函数，我们没有给其变量赋值，在没有给定严格模式前：

function f1(){
    num = 10;
    console.log('num的值是：'+num);
}
f1();

打印结果为：

当我们给该函数添加严格模式后：

function f1(){
    'use strict';
    num = 10;
    console.log('num的值是：'+num);
}
f1()

打印结果为：

打印出错。

(2) 严禁删除已经声明变量。例如，delete x 语法是错误的。

将上述的例子给num变量定义后，在删除该变量看看会怎样。

function f1(){
    'use strict';
    var num = 10;
    console.log('num的值是：'+num);
    delete num;
}
f1()

打印结果为：

可知无法删除。

2、严格模式下 this 指向问题

(1) 以前在全局作用域函数中的 this 指向 window 对象。 严格模式下全局作用域中函数中的 this 是 undefined。

function f1(){
    'use strict';
    console.log('严格模式下普通函数的this:'+this);
}
f1()

输出结果为：

(2) 以前构造函数时不加 new也可以 调用,当普通函数，this 指向全局对象。严格模式下,如果构造函数不加new调用, this指向的是undefined，如果给他赋值则会报错。

创建一个构造函数，将其当做普通函数直接调用，因为普通函数正常情况下this的指向是window,

function Star(){
    this.name = 'xl';
}
Star()

打印window.name看看结果：

console.log(window.name);

打印结果为：

可以得到属性值。

而当给该构造函数加入严格模式后打印的结果为：

可知打印有误，这是因为在严格模式下，普通函数的this指向undefine。

(3) new 实例化的构造函数指向创建的对象实例。

那如果给构造函数通过new实例化后呢？我们试一下。

function Star(){
    'use strict'
    this.name = 'xl';
}
var s = new Star();
console.log(s.name);

打印的结果为：

即严格模式下new 实例化的构造函数指向创建的对象实例。

(4) 定时器 this 还是指向 window。

那在定时器的严格模式下this又是如何指向的呢？

如下：

'use strict'
setTimeout(function(){
    console.log(this);
})

打印结果为：

可知，在该模式下，定时器 this 还是指向 window。

(5) 事件、对象还是指向调用者。

在严格模式下事件、对象中的this还是指向调用者，方法同上，就不在赘述。

3、函数变化

(1) 函数不能有重名的参数。

举例说明，比如现在有一个函数，我们将它的两个形参命名相同，在进行相应的操作，如下：

function fn(a,a){
    console.log(a+a);
}
fn(1,2)

打印的结果为：

可以发现能够正常运行。但是运行的结果却是错误的。为什么呢？这是因为当我们给两个相同的参数时，第二个的值或覆盖掉第一个参数的值。

那么在严格模式下呢？

'use strict'
function fn(a,a){
    console.log(a+a);
}
fn(1,2);

可知运行出错。所以函数不能有重名的参数。

(2) 函数必须声明在顶层，新版本的 JavaScript 会引入“块级作用域”（ ES6 中已引入）。为了与新版本接轨，不允许在非函数的代码块内声明函数。

例如下面的代码就是错误的:

if(n === 3){
    function fn(){
        conssole.log('您输入的值是2');
    }
    fn();
}

for(var i =0;i<=5;i++){
    function fn(){
        console.log('你好')
    }
    fn();
}

拓展

想了解更多关于严格模式要求，请点击链接