189 8069 5689

总结JS创建对象的模式

这篇文章主要讲解了总结JS创建对象的模式，内容清晰明了，对此有兴趣的小伙伴可以学习一下，相信大家阅读完之后会有帮助。

目前创新互联建站已为上1000+的企业提供了网站建设、域名、雅安服务器托管、网站托管维护、企业网站设计、青秀网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

1.工厂模式

抽象了创建具体对象的过程，创建了一种函数，封装特定的接口创建对象的细节。

  • 新建一个对象
  • 定义属性和方法
  • return刚新建的对象
function createPerson(name, age, job) {
 var obj = new Object();
 obj.name = name;
 obj.age = age;
 obj.job = job;
 obj.sayHi = function() {
 congsole.log(this.name);
 };
 return obj;
}

var person1 = createPerson("name1", "age1", "job1");
var person2 = createPerson("name2", "age2", "job2");

存在问题：

没有解决对象识别的问题（怎么识别对象的类型）

2.构造函数模式

  • 不显式创建对象
  • 直接将属性和方法定义在this中
  • 没有return
  • 通过 new操作符调用
function Person(name, age, job) {
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayHi = function() {
 console.log(this.name);
 };
}

var person1 = new Person("name1", "age1", "job1");
var person2 = new Person("name2", "age2", "job2");

存在问题：

  • 每个方法都要在实例上创建一次

3.原型模式

创建的每一个函数都有prototype原型属性，这个属性是一个指针，指向一个对象，这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。

所有原生引用类型都在其构造函数的原型上定义了方法

function Person{

}

Person.prototype.name="name"
Person.prototype.age="age"
Person.prototype.job="job"
Person.prototype.sayHi=function(){
 console.log(this.name)
}

var person1=new Person()
var person2=new Person()

存在问题：

  • 所有属性是被很多实例共享的

4.组合构造和原型模式

构造函数用来定义实例属性，原型模式用来定义方法和共享的属性

function Person(name, age, job) {
 this.name = name;
 this.age = age;
 this.job = job;
}
Person.prototype={
 constructor:Person;
 sayHi:function(){
 console.log(this.name)
 }
}

var person1 = new Person("name1", "age1", "job1");

5.动态原型模式

这里对原型的修改,能够对所有实例生效，只在初次调用构造函数会执行

function Person(name,age,job){
 this.name=name;
 this.age=age;
 this.job=job;
 if(typeof this.sayHi !="function" ){
 Person.prototype.sayHi=functong(){
  console.log(this.name)
 }
 }
}

var person1 = new Person("name1", "age1", "job1");

6.寄生构造函数模式

工厂模式+构造函数

  • 返回的对象与构造函数、构造函数的原型属性之间没有关系
  • 不能依赖instanceof来去定对象原型
  • 不建议使用
function Person(name, age, job) {
 var obj = new Object();
 obj.name = name;
 obj.age = age;
 obj.job = job;
 obj.sayHi = function() {
 congsole.log(this.name);
 };
 return obj;
}

var person1 = new Person("name1", "age1", "job1");

7.稳妥构造模式

  • 没有公共属性
  • 不使用this
  • 不使用new
function Person(name, age, job) {
 var obj = new Object();
 // 定义室友变量和函数
 obj.sayHi = function() {
 congsole.log(name);
 };
 return obj;
}

var person1 = Person("name1", "age1", "job1");
// name1

看完上述内容，是不是对总结JS创建对象的模式有进一步的了解，如果还想学习更多内容，欢迎关注创新互联行业资讯频道。


网页名称：总结JS创建对象的模式
本文来源：http://jkwzsj.com/article/gpgseh.html

其他资讯