码迷,mamicode.com
首页 > 其他好文 > 详细

es6对象扩展

时间:2018-11-25 13:10:42      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:设置   js对象   obj   es6   his   复制   object   code   name   

es5传统js对象

//类竟然是函数   
    function Dog(name,age){
        //构造器 竟然这么随意
        this.name = name;
        this.age = age;
    }

    //原型
    Dog.prototype.showAge=function(){
        console.log(this.age);
    }
    Dog.prototype.showName=function(){
        console.log(this.name);
    }
    let kj = new Dog('柯基','1');

     function Worker(name,age,job){
        //而且继承不了原型 还得手动拼接
        Dog.call(this,name,age);
        this.job = job;
    }

    Worker.prototype = new Dog();
    Worker.prototype.constructor = Worker;
    //注意 箭头函数 ==>特性还是挺坑的
    Worker.prototype.showJob=function(){
        console.log(this.job);
    }

    let w = new Worker('泰迪','1','日妥协');
    console.log(w);
    w.showAge();
    w.showJob();
    w.showName();

es6定义对象

//定义类
        class Dog{

            //构造器
            constructor(name,age){
                //属性和方法
                this.name=name;
                this.age=age;
                this.fn=function(){
                    console.log('哈哈哈');
                }
            }
            Fn(){
                console.log('我是不是 原型方法');
            }
        }

        let kj = new Dog('kj','0.5');
        console.log(kj);
        kj.Fn();

Object.assign

把多个对象的属性复制到一个对象中,第一个参数是复制的对象,从第二个参数开始往后,都是复制的源对象

var nameObj = {name:'zfpx'};
var ageObj = {age:8};
var obj = {};
Object.assign(obj,nameObj,ageObj);
console.log(obj);

//克隆对象
function clone (obj) {
  return Object.assign({}, obj);
}

Super

通过super可以调用prototype上的属性或方法
let person ={
    eat(){
        return 'milk';
    }
}
let student = {
    __proto__:person,
    eat(){
        return super.eat()+' bread'
    }
}
console.log(student.eat());

prop

直接在对象表达式中设置prototype

var obj1  = {name:'zfpx1'};
var obj3 = {
    __proto__:obj1
}
console.log(obj3.name);
console.log(Object.getPrototypeOf(obj3));

es6对象扩展

标签:设置   js对象   obj   es6   his   复制   object   code   name   

原文地址:https://www.cnblogs.com/heson/p/10015006.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!