很久没逛园子了,忙于工作,闲话少说,进入正题。
1:构造模式(Constructor Pattern)
先讲下js对象的3中创建方式:
var newObj = {}; var newObj = Object.create(null); var newObj = new Object();
常用的是第一种和第三种。
接着讲下给对象添加属性和方法的四种方法:
1.Dot语法 即通过“.”点号添加 给对象添加属性和值 newObj.someKey ="Hello javascript! i love u"; 获取属性值 var key = newObj.someKey; 2.方括号语法 newObj["someKey"] = "this is the second method!"; var key = newObj["someKey"]; 这两种是比较普遍的做法,ECMAScript3 编译通过 3.Object.defineProperty Object.defineProperty(newObj,"someKey",{ value:"好处在于可以对属性做更多的行为动作", writeable:true, enumerable:true, configurable:true }); 一种更通俗易懂的简单写法 var defineProp = function ( obj, key, value ){ config.value = value; Object.defineProperty( obj, key, config ); }; 使用这种方式,我们创建一个空person 对象 var person = Object.create(null); defineProp(person,"car","BMW"); defineProp(person,"dateOfBirth","1988"); defineProp(person,"hasbeard",true); 等等 4.Object.defineProperties 如果说刚才只能设置一个属性,这个可以设置多个属性,请看下面 Object.defineProperty(newObj,{ "someKey":{ value:"这是一些属性", writeable:true}, "anotherKey":{ value:"这是另外一 些属性", writeable:true} }); 说明:3,4在ECMAScript5下编译通过 可以用1或2的方式获取3或4属性或者方法,改成方法例子把 value:function(args){} 即可
使用这些方法能够用来继承,我们来做个小实验,看如下代码:
创建一个赛车手,继承上面的person对象 var driver = Object.create(person); 添加一些新的属性或方法 defineProp(driver,"topSpeed","100mph"); 我们输出日志看下是否继承了person的属性 console.log(driver.dateOfBirth); //output:1988 在重新获取新设置的属性 console.log(driver.topSpeed); //output:100mph
上面这些例子也告诉我们Js 没有class的概念,但是支持Object特殊的构造函数,通过简单地加前缀使用关键字“new”调用构造函数,我们可以告诉JavaScript我们希望用函数来表现得像一个构造函数、实例化一个新的对象与成员定义的函数。
简单的介绍后,我们来看基本的构造器模式的写法,如下:
function Car( model, year, miles ) { this.model = model; this.year = year; this.miles = miles; } //注意这里我们使用obj.protorype.newMethod 而不是Object.prototype是为了避免重定义原型对象 Car.prototype.toString = function () { return this.model + " has done " + this.miles + " miles"; }; // 用法: var civic = new Car( "Honda Civic", 2009, 20000 ); var mondeo = new Car( "Ford Mondeo", 2010, 5000 ); console.log( civic.toString() ); console.log( mondeo.toString() );
上面的ToString()的单实例,保证每台Car都能共用这个方法。这里就是一个简单的构造器模式。
下章讲解:模块化模式