19、es5严格模式

es5严格模式

前言

es版本

es有三个通用版本：es3.0 es5.0 es6.0

es版本升级

版本升级意味着有一些新语法产生，有老语法被摒弃，一样的方法在不同的版本可能产生的效果也不一样。

浏览器执行方法

浏览器是基于es3.0的方法 + es5.0的新增方法使用的(es5.0和es3.0产生冲突的部分用的是es3.0的)

es5.0严格模式

es5严格模式定义

es5.0的严格模式：指的是es3.0和es5.0的冲突(共有)的部分的规则就叫es5.0的严格模式

也就是如果使用了es5.0的严格模式 那么es3.0和es5.0产生冲突的部分就使用es5.0 如果没有使用es5.0的严格模式 那就使用es3.0

为什么要使用es5严格模式

因为es3.0的代码更加松散，es5.0严格模式可以保证代码更加精准

“use strict”

不再兼容es3的一些不规则语法。使用全新的es5规范。

"use strict"    // 写在页面逻辑最顶端启动es5.0严格模式
arguments.callee  // es3规定可以用argument.callee   es5规定不行
function test() {
    console.log(arguments.callee);
}
test();

两种用法:

全局严格模式

// 写在全局最顶端   则所有的方法都是使用es5的严格模式
"use strict" 
function test() {
    console.log(arguments.callee);
}
test();

局部函数内严格模式(推荐)

function demo() {
	console.log(arguments.callee);
}
demo( );
function test( ) {
	"use strict";  // 严格模式写在函数内部就只对当前函数生效
	console.log(arguments.callee);
}
test( );

就是一行字符串，不会对不兼容严格模式的浏览器产生影响。

严格模式写法"use strict"原因

// 为什么严格模式这么写？
"use strict"   // 字符串写法至少不报错

// 为什么不能这么写？
strict();  // 这么写会因为没有定义这个函数而报错

es5严格模式不支持的部分

with

with可以改变作用域链

var obj = {
	name : "obj"
}
var name = 'window ';
function test() {
	var name = 'scope';
     var age = 123;
    // with如果参数是对象 则会把这个对象当做with要执行的代码体的作用域链的最顶端  也就是访问with的name的话 会把obj当成最顶端的AO 去连在他原来作用域链的最顶端  也就是with里访问的就是obj中的属性
    with(obj) {  
		console.log(name);  // 所以这里访问的是obj的name
      	 console.log(age);  // 由于obj中没有age 正常找自己的age123
	}
}
test();

with的应用

结合命名空间使用，达到代码简化的目的。

// 命名空间
var org = {
    dp1: {
        jc : {
       		name : 'abc',
    		age : 123
        },
        deng : {
       		name : "xiaodeng",
             age : 234
        }
    },
    dp2: {
        
    }
}
with(org.dp1.jc) {
    // 这里访问的就是org.dp1.jc中的name属性 abc
    console.log(name);
}

// document的简化
with(document) {
    write('a');  // 直接使用document的方法
}

with的不足

由于with太强大了，直接改作用域链，而作用域链是一个很复杂的结构，系统内核会消耗大量的效率修改作用域链，会导致程序变得非常慢。

arguments.callee

"use strict"    // 写在页面逻辑最顶端启动es5.0严格模式
arguments.callee  // es3规定可以用argument.callee   es5规定不行
function test() {
    console.log(arguments.callee);
}
test();

func.caller

"use strict";
function test( ) {
	console.log(test.caller);  // 报错  严格模式不支持caller
}
function demo() {
	test();
}
demo();

严格模式的规定

变量赋值前必须声明

// es3.0规定 如果变量未声明就默认视为全局变量  归window所有
// es5.0严格模式直接要求必须声明变量

局部this必须被赋值(Person.call(null/undefined)赋值什么就是什么)

es5严格模式规定：局部的this预编译的时候是空,没有指向，这个this必须被赋值，而且赋值什么就是什么。

"use strict";
function test () {
	console.log(this); 
}
test();  // 输出结果是undefined 因为es5严格模式要求必须赋值 
// 下面代码能生成新对象test{} 输出的test是构造器的名字
// new test(); ==> var test = new test();

// test.call({});  生成一个空对象
// test.call(123);  赋值123

// test.call(123);  非严格模式下这写会被包装成包装类

严格模式下全局的this还是指向window

console.log(this);

拒绝重复属性和参数

// cs3.0中重复的参数不报错
function test(name,name) {
	console.log( name);
}
test(1,2);  // 输出结果是2(后者)

// cs5.0严格模式中重复的参数会报错
"use strict";
function test(name,name) {
	console.log( name);
}
test(1,2);  // 报错

// cs5.0严格模式中重复的属性名也不支持 但是不报错(目前，以后可能报错)
"use strict";
var obj = {
    name : "123";
    name : "234"
}

eval

// es3.0都不能使用eval();  eval是魔鬼  能改变作用域
"use strict"
var a = 123;
eval('console.log(a)');  // eval会把字符串当代码使用
模式中重复的属性名也不支持 但是不报错(目前，以后可能报错)
"use strict";
var obj = {
    name : "123";
    name : "234"
}

eval

// es3.0都不能使用eval();  eval是魔鬼  能改变作用域
"use strict"
var a = 123;
eval('console.log(a)');  // eval会把字符串当代码使用