原生js创建对象的4种方法以及优缺点

  1. 直接创建
var obj = {
	name: "王一",
	age: 18,
	width: 98,
	inio: function(){
		console.log(this.name)
	}
}

var obj1 = {
	name: "王二",
	age: 18,
	width: 98,
	inio: function(){
		console.log(this.name)
	}
}

obj.inio();
obj1.inio();

优点:简单、方便
缺点:无法快速量产,复用性极差

  1. 工厂模式创建
function create(name,age,height){
	 var obj = {}
     obj.name = name
     obj.age = age
     obj.height = height
     obj.showInfo = function(){
         console.log(this.name)
     }
     return obj
}

var s1=create("李四",21,180);
var s2= s1 instanceof create;
console.log(s2) // false

优点:通过函数封装的形式虽然可以快速量产以及提高复用性
缺点:但弊端也很明显,无法检测所创建对象的明确类型

  1. 构造函数创建
function Student(name,age,height){
	this.name=name
	this.age=age
	this.height=height
	this.showInfo=function(){
	  	console.log(this.name)
	}
}

var s1 = new Student("王一",18,175)
var s2 = new Student("王二",21,185)
console.log(s1.showInfo == s2.showInfo) // false

优点:量产,解决了工厂模式无法检测类型的问题
缺点:相同的方法,没有开辟共同的空间,导致内存消耗太大

4. 原型创建对象
function Student(name,age,height){
    this.name = name
    this.age = age
    this.height = height   
}

Student.prototype.showInfo = function(){
	console.log(this.name)
}

var s1 = new Student("王一",18,175)
s1.__proto__.showInfo = function(){
    console.log("改变了showinfo")
}
s1.showInfo() 

优点:通过把方法挂载到原型对象上,解决了内存浪费的问题。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值