你的位置:首页 > 软件开发 > Java > JS创建对象篇

JS创建对象篇

发布时间:2015-10-31 20:00:08
JS创建对象篇Object构造函数创建 var person = new Object(); person.name = "Tom"; person.age = 10; person.sayName = function(){ alert(this.name) ...

JS创建对象篇

JS创建对象篇

  1. Object构造函数创建

 var person = new Object(); person.name = "Tom"; person.age = 10; person.sayName = function(){ alert(this.name); }
  1. 对象字面量

var person = {  name : "Tom",//注意这边是以“,"分隔,而不是”;" age : 10, sayName : function(){ alert(this.name); }

这两种创建对象的方式都比较简便,可以用来创建单个对象。但是如果使用一个接口创建多个对象时会产生大量的重复代码。

  1. 工厂模式

function createPerson(name,age){ var o = new Object();//显示的创建一个对象 o.name = name; o.age = age; o.sayName = function(){ alert(this.name); } return o;//返回对象 } var person1 = createPerson("Tom",10); var person2 = createPerson("Jack",9);

工厂模式抽象了创建具体对象的过程这样我们就可以传入参数创建多个对象了。但是没有解决对象的识别问题

  1. 构造函数模式

function Person(name,age){  this.name = name; this.age = age; this.sayName = function(){ alert(this.name); } } var person1 = new Person("Tom",10); var person2 = new Person("Jack",9); //对象构造函数(constructor属性)都指向Person console.log(person1.constructor == Person);//true //用instanceOf来检测类型 console.log(person1 instanceOf Object);//true console.log(person2 instanceOf Person);//true 

构造函数和普通函数的区别只是调用的方式有所差别,任何函数,只要new操作符来调用的话都作为构造函数(this的绑定规则),但是构造函数模式也存在问题:每个方法都要在每个实例上重新创建一遍。

console.log(person1.sayName == person2.sayName);//false
  1. 原型模式

我们创建的每一个函数都有一个prototype属性,这个属性是一个指针,指向一个对象

function Person(){}Person.prototype.name = "Tom";Person.prototype.age = 10;Person.prototype.sayName = function(){alert(this.name);}var person1 = new Person();person1.sayName();//Tomvar person2 = new Person();person2.sayName();//Tomconsole.log(person1.sayName == person2.sayName);//true

跟构造函数模式不同,添加在prototype中的所有属性和方法都是共享的,也就是说person1和person2访问的都是同一组属性和同一个方法每当代码读取某个属性(eg:alert(person1.job))的时候,都会执行一次搜索,目标是具有给定名字的属性,首先从对象实例本身开始,如果找到该属性则返回该属性的值,如果没有找到,则继续在原型链上向上查找,直到找到该属性停止,如果查找到原型链顶部,但是仍然没有找到指定的属性,就会返回 undefined;

原标题:JS创建对象篇

关键词:JS

JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。