02ES5中的一些扩展

1、js 对象(数组) –> json 对象(数组)：

    JSON.stringify(obj/arr)

2、json 对象(数组) –> js 对象(数组)：

    JSON.parse(json)

上面这两个方法是 ES5 中提供的。

我们要记住，我们通常说的“json 字符串”，只有两种：json 对象、json 数组。

typeof json 字符串 的返回结果是 string。

ES5 给 Object 扩展了一些静态方法，常用的有 2 个，我们接下来讲解。

    Object.create(prototype, [descriptors])

作用: 以指定对象为原型，创建新的对象。同时，第二个参数可以为为新的对象添加新的属性，并对此属性进行描述。

举例 1 ：（没有第二个参数时）

    var obj1 = {username: 'smyhvae', age: 26};
    var obj2 = {address:'shenzhen'};

    obj2 = Object.create(obj1);
    console.log(obj2);

打印结果：

我们发现，obj1 成为了 obj2 的原型。

举例 2 ：（有第二个参数时）

第二个参数可以给新的对象添加新的属性。我们修改上面的代码，尝试给 obj2 添加新属性sex：

    var obj1 = {username: 'smyhvae', age: 26};
    var obj2 = {address: 'shenzhen'};

    obj2 = Object.create(obj1, {
        sex: {// 给 obj2 添加新的属性 `sex`。注意，这一行的冒号不要漏掉
            value: '男',  // 通过 value 关键字设置 sex 的属性值
            writable: false,
            configurable: true,
            enumerable: true
        }
    });

    console.log(obj2);

上方代码中，我们通过第 5 行的 sex 给 obj2 设置了一个新的属性 sex，但是要通过value 来设置属性值（第 6 行）。

设置完属性值后，这个属性值默认是不可修改的，要通过 writable 来设置。总而言之，这几个关键字的解释如下：

value：设置属性值。
writable：标识当前属性值是否可修改。如果不写的话，默认为 false，不可修改。
configurable：标识当前属性是否可以被删除。默认为 false，不可删除。
enumerable：标识当前属性是否能用 for in 枚举。默认为 false，不可。

Object.defineProperty(obj2, 'sex', {
        value: 'cc',
        writable: true,
        configurable: true,
        enumerable: true,
      });

这个方法有点难理解。

    Object.defineProperties(object, descriptors)

作用：为指定对象定义扩展多个属性。

代码举例：

    var obj2 = {
        firstName : 'smyh',
        lastName : 'vae'
    };
    Object.defineProperties(obj2, {
        fullName : {get : function () {return this.firstName + '-' + this.lastName},
            set : function (data) {  // 监听扩展属性，当扩展属性发生变化的时候自动调用，自动调用后将变化的值作为实参注入到 set 函数
                var names = data.split('-');
                this.firstName = names[0];
                this.lastName = names[1];
            }
        }
    });
    console.log(obj2.fullName);
    obj2.firstName = 'tim';
    obj2.lastName = 'duncan';
    console.log(obj2.fullName);
    obj2.fullName = 'kobe-bryant';
    console.log(obj2.fullName);

get：用来获取当前属性值的回调函数
set：修改当前属性值得触发的回调函数，并且实参即为修改后的值

存取器属性：setter,getter 一个用来存值，一个用来取值。

obj 对象本身就自带了两个方法。格式如下：

get 属性名(){} 用来得到当前属性值的回调函数

set 属性名(){} 用来监视当前属性值变化的回调函数

举例如下：

    var obj = {
        firstName : 'kobe',
        lastName : 'bryant',
        get fullName(){return this.firstName + ' ' + this.lastName},
        set fullName(data){var names = data.split(' ');
            this.firstName = names[0];
            this.lastName = names[1];
        }
    };
    console.log(obj.fullName);
    obj.fullName = 'curry stephen';
    console.log(obj.fullName);

下面讲的这几个方法，都是给数组的实例用的。

下面提到的数组的这五个方法，更详细的内容，可以看《03-JavaScript 基础 /15- 数组的常见方法.md》

方法 1 ：

    Array.prototype.indexOf(value)

作用：获取 value 在数组中的第一个下标。

方法 2 ：

    Array.prototype.lastIndexOf(value)

作用：获取 value 在数组中的最后一个下标。

方法 3 ：遍历数组

    Array.prototype.forEach(function(item, index){})

方法 4 ：

    Array.prototype.map(function(item, index){})

作用：遍历数组返回一个新的数组，返回的是 加工之后 的新数组。

方法 5 ：

    Array.prototype.filter(function(item, index){})

作用：遍历过滤出一个新的子数组，返回条件为 true 的值。

ES5 中新增了 bind() 函数来改变 this 的指向。

    Function.prototype.bind(obj)

作用：将函数内的 this 绑定为 obj, 并将函数返回。

面试题 : call()、apply() 和 bind()的区别：

都能改变 this 的指向
call()/apply()是 立即调用函数
bind()：绑定完 this 后，不会立即调用当前函数，而是 将函数返回 ，因此后面还需要再加() 才能调用。

PS：bind()传参的方式和 call()一样。

分析：

为什么 ES5 中要加入 bind()方法来改变 this 的指向呢？因为 bind()不会立即调用当前函数。

bind()通常使用在回调函数中，因为回调函数并不会立即调用。如果你希望在回调函数中改变 this，不妨使用 bind()。

02ES5中的一些扩展

JSON 对象

Object 的扩展

方法一

单独设置属性

方法二

Object 的扩展（二）

数组的扩展

函数 function 的扩展：bind()