八,ES6为对象做的一些扩展

来源:互联网 发布:新代系统编程说明书 编辑:程序博客网 时间:2024/05/18 01:53

ES6中对象属性的写法:

var  name="老沙";

var age=200;

var person={name,age}

console.log(person}//person{name:"老沙",age:"200"}

新写法只需要简单的写入变量名即可;

ES6中对象方法的写法:

传统写法:

preson={

name:“老沙”,

age:function(){return 200}

}

ES6写法:

preson={

name:“老沙”,

age(){return 200}

}

可以看出,新写法减少了很多代码量

属性名可以是表达式

var a="Iove";

var b="you";

var c="hate";

var person={

[a+b]:"me too",

[c+b](){return "me too haha"}

}

console.log(person.loveyou)//me too

console.log(person.hateyou)//me too haha

其中属性名和方法名都是用中括号[ ]包裹着,里面都是一个字符串相加的表达式,这就告诉我们,用字面量(大括号{ })定义对象的时候,属性名和方法名可以是一个表达式,表达式的运算结果就是属性名或者方法名

Object.is()函数;

var  a=20;

var b="20";

var c=20;

Object.is(a,b)//false

Object.is(a,c)//true

Object.assign()函数

将源对象的属性赋值到目标对象上

    let target = {"a":1};  //这个充当目标对象
    let origin = {"b":2,"c":3};   //这个充当源对象
    Object.assign(target,origin);
    //打印target对象出来看一下
    console.log(target);
    //结果 {a: 1, b: 2, c: 3}

 注意输出的结果,target对象已经不是{ a:1 }了,而是变成了{a: 1, b: 2, c: 3},经过Object.assign( )函数的处理,源对象的属性被添加到了target对象上。这就是Object.assign( )函数的作用,Object.assign( )函数的参数还可以是多个(至少是两个)

如果赋值过程中,对象的属性出现了相同的名字怎么办?如果这样,后面的属性值就会覆盖前面的属性值

巧妙利用Object.assign( )函数的功能,我们可以完成很多效果,比如:给对象添加属性和方法,克隆对象,合并多个对象,为对象的属性指定默认值。

Object.getPrototypeOf( )函数

获取一个对象的prototype属性

//自定义一个Person类(函数)

    function Person(){   }

    //函数都有一个预属性prototype对象

    Person.prototype = {

        //给prototype对象添加一个say方法

        say(){

            console.log('hello');

        }

    };

    //实例化Person对象,赋值给变量allen

    let allen = new Person();

    //调用类的say方法

    allen.say();

    //结果:打印出hello

    //获取allen对象的prototype属性

    Object.getPrototypeOf(allen);

    //结果:打印{say:function(){.....}}

如果你想看看prototype中还有哪些方法和属性,那么,你就可以使用Object.getPrototypeOf( )函数来获取,参数就是allen对象

Object.setPrototypeOf()函数

设置一个对象的prototype属性

//自定义一个Person类(函数)

    function Person(){   }

    //函数都有一个预属性prototype对象

    Person.prototype = {

        //给prototype对象添加一个say方法

        say(){

            console.log('hello');

        }

    };

    //实例化Person对象,赋值给变量allen

    let allen = new Person();

    //调用类的say方法

    allen.say();

    //结果:打印出hello

  //使用Object.setPrototypeOf

    Object.setPrototypeOf(

            allen,

            {say(){console.log('hi')}

    });

    //再次调用类的say方法

    allen.say();

    //结果:打印出hi

使用Object.setPrototypeOf()函数对对象的prototype属性进行了修改,具体的修改是重写了say方法。在修改前,我们曾经调用过一次say( )方法,得到的结果是打印hello,修改之后我们再一次调用allen.say( );得到的结果是打印出hi,说明我们修改成功了。

javascript的面向对象

模拟面向对象编程有几个关键步骤:1、构造函数;2、给prototype对象添加属性和方法;3、实例化;4、通过实例化后的对象调用类的方法或者属性。

 //构造函数模拟创建一个Dog类
    function Dog(name){
        this.name = name;
    }
    //把一些属性和方法,定义在prototype对象上
    Dog.prototype = {
        "type":"动物",
        "say":function(){
            alert("名字叫"+this.name);
        }
    };
    //实例化
    var dog = new Dog('旺财');
    //调用say方法
    dog.say();
    //结果:名字叫旺财

0 0