javascript创建对象的一些方式

通过创建一个Object实例

 var person = new Object();
 person.name = "zhouquan";
 person.age = 21;
 person.sayName = function(){
   console.log(this.name);
 };

 person.sayName();//zhouquan

对象字面量方式

var person = {
  name: "zhouquan",
  age: 21,
  sayName:function(){
    console.log(this.name);
  }
};

person.sayName();//zhouquan

通过普通的创建object实例的方式和对象字面量的方式创建对象的方式的缺点在于:这两种方式都不适合多次创建同一类型的对象。

工厂模式

 function createPerson(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 person1 = createPerson("zhouquan", 22, "student");
 person1.sayName();  //zhouquan    

 var person2 = createPerson("zhouquan2", 23, "Programer");
 person2.sayName();  //zhouquan2

函数createPerson()能够根据接受的参数来构建一个包含所有必要信息的Person对象。可以无数次的调用这个函数,而每次都会返回一个包含数个属性的和一个方法的对象。工厂模式虽然解决的创建多个类似对象的问题,但却没有解决对象识别的问题(即怎样知道一个对象的类型)。

构造函数模式

function Person(name, age){
  this.name = name;
  this.age = age;
  this.sayName = function(){
    console.log(this.name);
  };
}

var person1 = new Person("zhouquan", 21);
person1.sayName();  //zhouquan
var person2 = new Person("zhouquan2", 23);
person2.sayName();  //zhouquan2

用这种方式创建对象更工厂模式比起来具有以下几点区别:

  • 没有显示的创建对象
  • 直接将属性和方法赋给了this对象
  • 没有return语句

此外,还应该注意到函数名Person使用的大写字母P。这个是为了区别于其他的函数。

原型模式

function Person(){
}
Person.prototype.name = "zhouquan";
Person.prototype.age = 21;
Person.prototype.sayName = function(){
  console.log(this.name);
};

var person1 = new Person();
person1.sayName();//zhouquan

var person2 = new Person();
person2.sayName();//zhouquan

prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以有特定类型的所有实例共享的属性和方法。使用原型对象的好处也就是可以让所有的对象实例共享它所包含的属性和方法。

但是这种方法写起来还是不方便,需要在每一个属性或者方法前面书写Person.prototype,我可以结合前面的对象字面量的方法来进行改进:

function Person(){
}
Person.prototype={
  name : "zhouquan",
  age : 21,
  sayName : function(){
    console.log(this.name);
  }
};

var person1 = new Person();
person1.sayName();//zhouquan

var person2 = new Person();
person2.sayName();//zhouquan

组合使用构造函数模式和原型模式

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

var person1 = new Person("zhouquan", 21);
person1.sayName();//zhouquan

var person2 = new Person("xiaozhou", 21);
person2.sayName();//xiaozhou

这种方式是创建自定义类型的最常见方式。构造函数模式用于定义实例属性,而原型模式用于定义方法和共享的属性。这样,每个实例都会有自己的一份实例属性的副本,但同时又共享这对方法的引用,最大限度地节省了内存。另外,这种组合模式还支持向构造函数传递参数。可以说,这是用来定义引用类型的一中默认模式。

动态原型模式

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

var person1 = new Person("zhouquan", 21);
person1.sayName();//zhouquan

var person2 = new Person("xiaozhou", 21);
person2.sayName();//xiaozhou

这里只在sayName()方法不存在的情况下,才会将它添加到原型中,if语句只在初次调用函数时才会执行。其中if语句检查的可以是初始化之后应该存在的任何属性或方法,不必用一大堆if语句检查每个属性和方法,只要检查一个即可。需要注意的是,使用动态原型模式时,不能使用对象字面量重写原型,因为如果在以及创建了实例的情况下重写原型,那么就会切断现有实例与新原型之间的联系。

原文地址:https://www.cnblogs.com/magic-xxj/p/9186398.html

时间: 2024-08-29 04:05:17

javascript创建对象的一些方式的相关文章

JavaScript创建对象的默认方式:组合使用构造函数模式和原型模式

由于 JavaScript中没有类,对象充当着一系列集合的模板,包含着属性和方法,而每个对象中也有一个原型对象,可以存放共享方法和属性 . 创建自定义类型的最常见方式,就是组合使用构造函数模式与原型模式.构造函数模式用于定义实例属性,而原型模式用于定义方法和共享的属性 //组合使用构造函数模式(构造函数设置自己的属性)和原型模式(原型设计那些共享的方法和属性) function Person(name,age,job){ this.name=name; this.age=age; this.jo

javascript 创建对象几种方式

构造函数,原型, 实例之间的关系: 1. 工厂模式 例如:  createPerson()函数虽然解决了多个相似对象的创建,但是没有解决对象的识别的问题,即怎么知道一个对象的类型 1 function createPerson(name, age, job) { 2 var o = new Object();4 o.age = age; 5 o.job = job; 6 o.sayName = function() { console.log(this.name)}; 7 return o; 8

JavaScript 创建对象的七种方式

转自:xxxgitone.github.io/2017/06/10/JavaScript创建对象的七种方式/ JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产.接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点. 工厂模式 1 function createPerson(name, job) { 2 var o = new Object() 3 o.name = name 4 o.job

补充:JavaScript 创建对象的七种方式

JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产.接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点. 工厂模式 1 function createPerson(name, job) { 2 var o = new Object() 3 o.name = name 4 o.job = job 5 o.sayName = function() { 6 console.log(this.na

JavaScript创建类的方式

一些写类工具函数或框架的写类方式本质上都是 构造函数+原型.只有理解这一点才能真正明白如何用JavaScript写出面向对象的代码,或者说组织代码的方式使用面向对象方式.当然用JS也可写出函数式的代码,它是多泛型的. 为了讨论的单一性,暂不考虑类的继承,(私有,受保护)属性或方法.EMCAScript中实际没有类(class)的概念,但可以把它理解为更广义的概念. 1.构造函数方式 /** * Person类:定义一个人,有个属性name,和一个getName方法 * @param {Strin

Javascript 创建对象方法的总结(每天一些学习真的很快乐)

使用Javascript创建对象的方法有很多,现在就来列举一下: 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); person.name="kevin"; person.age=31; alert(person.name); alert(person["name"]) 2. 使用对象字面量创建一个对象:不要奇怪person["5&

Javascript 创建对象方法的总结

最近看了一下<Javascript高级程序设计(第三版)>,这本书很多人都推荐,我也再次郑重推荐一下.看过之后总得总结一下吧,于是我选了这么一个主题分享给大家. 使用Javascript创建对象的方法有很多,现在就来列举一下: 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); person.name="kevin"; person.age=31; a

【译】JavaScript 创建对象: 方法一览与最佳实践

本文是我在众成翻译上认领并翻译的:JavaScript 创建对象: 方法一览与最佳实践 在JavaScript中“创建对象”是一个复杂的话题.这门语言提供了很多种创建对象的方式,不论新手还是老手都可能对此感到无所适从,不知道应该选择哪一种.不过,尽管创建对象的方法很多,看上去语法差异也很大,但实际上它们的相似性可能比你所以为的要多.本文将带领你踏上一段梳理对象创建方法的旅程,为你揭示不同方法之间的依赖与递进关系. 对象字面量 我们的第一站毫无疑问就是创建对象最简单的方法,对象字面量.JavaSc

JavaScript创建对象、原型与继承

JavaScript是一门极其灵活的语言,烂七八糟的设计是它最大的优点.不同于其他严格类型的语言例如java,学习曲线比较友好.JavaScript个人感觉上手基本不用费劲,要想上高度那就是一个悲催而且毁三观的故事.特别是有面向对象语言基础的人来说,JavaScript真像一个噩梦.JavaScript更加的零碎,封装的不是很好.你必须理清脉络深入理解了,才能写出来高大上的优雅的代码.在下尽量的用简练易懂的语言,简单的阐述一下我对JavaScript面向对象的一点粗浅的理解. 1,要想面向对象先