JavaScript之ES5新特性

this

function中的this——谁调用指向谁

1.注册在对象中的function里面的this

var obj = {
    a:10,
    fn(){
        console.log(this. a)
    }

注：对象中fn(){}是fn:function(){}的简写

obj.fn()//10

注册在对象内的方法一定由对象调用，所以fn中的this执向obj

2.注册在全局作用域中的function

var a = 10;
function fn(){
    console.log(this. A)
}
fn()//10

注：所有注册侧在全局的变量和方法都是window的属性，所以fn()的完全体是window.fn()里面的this指向window

3.回调函数与方法内的函数

只要是直接调用的方法（前面没有前缀），里面的this必定指向window

构造方法的继承

//父类：人
//构造函数
function Person(name,age){
    this.name = name;
    this.age = age;
}
//原型...

//子类：程序员类
//构造函数
//程序员作为人的子类，人的属性程序员一定有
//需求：相同的属性，从父类继承，而不是自己声明
function Programmer(name,age,salary){
    //name,age继承自父类
    //Person(name,age)
    //因为直接调用的方法中的this指向window
    //所以name与age成为了window的属性

    //new Person(name,age)
    //new的作用是实例化出一个新对象，并把属性声明在新对象中
    //这个新对象在Person方法中并不是new p的到的性对象

    //问题出在Person的this指向中
    //解决：写在Programmer里面的this指向正确
    //只要让Person中的this指向Programmer中的this即可
    //强行改变this指向
    Person.call(this,name,age)
    //call的作用，执行方法
    //让方法中的this指向第一个参数
    //后面的参数是传递给原方法的实参

    //salary是程序员独有的属性，自己声明
    this.salary = salary;
}
var p = new Programmer('xiaoming',18,10000)
console.log(p)

 ES5新特性

严格模式

在这种模式下，JS语言需要更加严谨，一些不太严谨的写法会报错。

如何开启严格模式？

'use strict'//开启严格模式

禁止使用为声明的变量——禁止隐式声明

a=10;//严格模式下报错

静默失败升级为报错

var arr = [1, 2, 3, 4, 5];
console.log(arr.length)

删除length属性

delete arr.length
console.log(arr.length)

非严格模式下。删除失败，但是没有任何提示，即静默失败

严格模式下，报错，静默失败升级为报错

防递归

斐波那契额数列

function feb(n){
    //返回数列中的第n项的值
    if(n==1||n==2){
        return 1;
    }else{
        return feb(n-1)+feb(n-2);
    }
}

console.log(feb(1))//1
console.log(feb(5))//5

function feb(n){
    //返回数列中的第n项的值
    if(n==1||n==2){
        return 1;
    }else{
        return arguments.callee(n-1)+arguments.callee(n-2);
    }
}

console.log(feb(1))//严格模式下报错

对象属性

修改属性

var arr=new Array(1,2,3);
console.log(arr)
console.log(arr.length)//构造函数中的方法
console.log(arr.reverse())//原型上的方法

//修改length属性
arr.length=8;//修改成功
console.log(arr.length)//8
//删除length属性
delete arr.length;//删除失败
console.log(arr.length)//8
//把arr看做对象，下标及length是属性名，用for...in遍历
for(var i in arr){
    console.log(arr[i])
}
//只能遍历出数字下标的值，length属性无法遍历

//访问reverse方法
console.log(Array.prototype.reverse)
//修改
Array.prototype.reverse=100;//修改成功
console.log(Array.prototype.reverse)//100
//删除
delete Array.prototype.reverse;//删除成功
console.log(Array.prototype.reverse)//100
//遍历
for(var i in Array.prototype){
    console.log(Array.prototype[i])
}
//无法遍历

综上，对于对象的属性，我们有三个维度进行控制

分别是：是否可以修改，是否可以删除，遍历对象时是否可以遍历出来

三个维度

var obj = {
    a:10,
    b:20,
}
//对象的属性，都是可以修改以及遍历
//如何在这三个维度进行控制？
Object.defineProperty(obj,{
    a:{
        wirtable:false,//不可修改
        enumerable:false,//不可遍历
        configurable:false,//不可配置
    }
})
//参数1：对那个对象的属性进行控制
//参数2：控制配置项
console.log(obj.a)
obj.a = 100;//修改失败
console.log(obj.a)//10
for(var key in obj){
    console.log(key)
}//无法遍历a
delete obj.a//删除失败
console.log(obj.a)//10

如何理解不可配置？

实际开发中，项木内部的对象属性不能被客户修改

以属性b为例，本身不可修改，但是这个控制属性可以修改。

Object.defineProperty(obj,{
    b:{
        wirtable:true,//不可修改
    }
})
obj.b = 100;//修改成功
console.log(obj.b)//100

属性a设置了不可配置，就无法修改控制属性

Object.defineProperty(obj,{
    a:{
        wirtable:true//报错
    }
})

防止对象被篡改

级别1：不允许扩展对象

var obj={
    a:10,
    b:20,
}
Object.preventExtensions(obj)
obj.c=30//扩展失败
console.log(obj)//没有属性c
delete obj.b//删除成功
obj.a=40//修改成功
console.log(obj)

 级别2：不允许修改对象的属性

var obj={
    a:10,
    b:20,
}
Object.seal(obj)
obj.c=30//扩展失败
console.log(obj)//没有属性c
delete obj.b//删除失败
console.log(obj)
//这是一个较为常用的方法
//seal就是在preventExtensions给每一个属性添加不可配置
//要注意，在seal前要完成对属性的控制

级别3：冻结属性（属性和属性值都不可修改）

var obj={
    a:10,
    b:20,
}
Object.freeze(obj)
obj.c=30//扩展失败
delete obj.b//删除失败
obj.a=40//修改失败
console.log(obj)