面试题之严格模式与混搭模式

1.严格模式（standards）

          1.1 含义：是在标准模式的情况下，浏览器按照w3c标准解析代码。
          1.2 触发方式：
               1.2.1 如果文档里面包含了严格的 DOCTYPE，一般表现形式为严格模式。
               1.2.2 如果包含过渡 DTD 和 URI 的 DOCTYPE ，也通常以严格模式表现出来。

2.混搭模式(quirks)

          2.1 含义：又叫做怪异模式或者兼容模式，浏览器按照自己的方式进行解析的。
          2.2 触发方式：
               2.2.1 如果有过渡 的DTD 而没有 URI（统一资源标识符，就是声明最后的地址）,通常表现为混搭模式。
               2.2.2 如果DOCTYPE 不存在或形式不正确 ，也通常为混搭模式表现出来。

3.两者之间的区别

          3.1 在严格模式下，如果设置一个元素的宽度和高度，指的是元素内容的宽度和高度，而在混搭模式下，元素的宽度和高度还包含了padding和border。
          3.2 使用margin：0 auto,在严格模式下，可以使元素水平居中，但在混搭模式下是无效的。
          3.3 在严格模式下，伪数组arguments变为参数的静态副本。而在非严格模式下，伪数组arguments对象里的元素和对应的参数是指向同一个值的引用。

!function(a) {
    "use strict";
    arguments[0] = 10;
    console.log(a);  // 严格模式输出a的值：1，非严格模式输出a的值：10
}(1);

如果实参是对象除外

!function(a) {
    "use strict";
    console.log(a.x);  // 输出结果都为：1
    arguments[0].x = 10;
    console.log(a.x);  // 输出结果都为：10
}({x: 1});

          3.4 在严格模式下，删除参数名，函数会报错。而在非严格模式下，返回false。不报错也没有作用。

!function(a) {
    console.log(a);  //1
    console.log(delete a);  //false
    console.log(a);  //1
}(1);

!function(a) {
    "use strict";
    console.log(a);  //1
    delete a;  //SyntaxError
    console.log(a);  //1
}(1)

          3.5 .严格模式下，函数参数名重复报错。非严格模式最后一个重名参数会覆盖之前的重名参数。

!function (a, a, b) {
    "use strict";
    console.log(a + b);  // 严格模式：SyntaxError，非严格模式：5
}(1, 2, 3);

          3.6 严格模式下，删除不可配置(configurable=false)的属性报错。非严格模式，但会false，静默失败。

!function (a){
    "use strict";
    var obj={};
    Object.defineProperty(obj, 'a', { configurable: false });
    console.log(delete obj.a); //严格模式：TypeError， 非严格模式：flase
}(1);