JS中几种创建对象的方式

new Object()

直接通过构造函数创建一个新对象。

var obj = new Object()
//等同于 var obj = {}
复制代码

使用字面量的方式更简单,其实他俩是一样的。 优点是足够简单,缺点是每个对象都是独立的。

工厂模式

function createObj(name,age){
    var obj = {};
    obj.name=name;
    obj.age=age;
    return obj
}
var Anson = createObj('Anson', 18)
console.log(Anson)
//{name: "Anson", age: 18}
复制代码

优点是 可以解决创建多个相似对象的问题,缺点是 无法识别对象的类型。

构造函数

function Person(name,age){
    this.name =name;
    this.age=age;
    this.sayName =function (){ alert(this.name) }
}
var person = new Person('小明',13);
console.log(person);
//Person {name: "小明", age: 13, sayName: ƒ}
复制代码

优点是 可以创建特定类型的对象,缺点是 多个实例重复创建方法

(构造函数+原型)组合模式

function Person(name, age){
    this.name = name;
    this.age = age;
    Person.prototype.sayName = function (){ alert(this.name) }
 }
var person = new Person('小白',18)
console.log(person);
//Person {name: "小白", age: 18} __proto__ -> sayName: ƒ ()
复制代码

优点 多个实例引用一个原型上的方法 比较常用

动态原型

function Person(name,age){
    this.name=name
    this.age =age
    if(typeof this.sayName != 'function'){
        Person.prototype.sayName = function(){ alert(this.name) }
  }
}
var person = new Person('小红',15)
console.log(person);
//Person {name: "小红", age: 15} 动态创建sayName: ƒ ()
复制代码

优点 可以判断某个方法是否有效,来决定是否需要初始化原型,if只会在仅在碰到第一个实例调用方法 时会执行,此后所有实例共享此方法,需要注意的一点是,不能重新原型对象。

寄生构造函数模式

function Person(name,age,job){
    var o=new Object();
    o.name=name;
    o.age=age;
    o.job=job;
    o.sayName=function(){
        console.log(this.name)
    }
    return o;
}
var friend=new Person("her",18,"Front-end Engineer");
friend.sayName();
//her
复制代码

除了使用new操作符,其他的和工厂函数一样,可以为对象创建构造函数。

稳妥模式

function Person(name, age){
    var o={};
    o.sayName=function(){ alert(name) }
    return o;
}
var person = ('小亮',24);
person.sayName();//’小亮‘
复制代码

除了使用person.sayName()之外 ,没有办法在访问到name的值,适合在某些安全执行环景下使用。

Object.create()

const person = {
  isHuman: false,
  printIntroduction: function () {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  }
};

const me = Object.create(person);

me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten

me.printIntroduction();
// expected output: "My name is Matthew. Am I human? true"
复制代码

传入一个原型对象,创建一个新对象,使用现有的对象来提供新创建的对象的__proto__,实现继承。

参考:《JavaScript高级程序设计第三版》、MDN

转载于:https://juejin.im/post/5cf09e3751882552a826eed2

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值