首页 > Web开发 > 详细

入门js设计模式——构造函数模式

时间:2016-02-24 19:22:01      阅读:220      评论:0      收藏:0      [点我收藏+]
参考或者说照搬:http://www.cnblogs.com/TomXu/archive/2012/02/21/2352994.html

1.构造函数

在JavaScript里,构造函数通常是认为用来实现实例的,JavaScript没有类的概念,但是有特殊的构造函数。通过new关键字来调用定义的构造函数,你可以告诉JavaScript你要创建一个新对象并且新对象的成员声明都是构造函数里定义的。

默认地在构造函数中,函数名首字母大写。

(我觉得构造函数就像是用于做月饼的模子,用这个模子做出来的月饼基本形状是一样的(相同的属性和方法及相同的构造方法),但是馅可以不同(具体的值是不一样的),馅是在new一个对象的时候填进去的)

2.原型prototype :函数的一个属性

JavaScript里函数有个原型属性叫prototype,当调用构造函数创建对象的时候,所有该构造函数原型的属性在新创建对象上都可用。

 

function Car(model, year, miles) {
    this.model = model;
    this.year = year;
    this.miles = miles;
}

/*
注意:这里我们使用了Object.prototype.方法名,而不是Object.prototype
主要是用来避免重写定义原型prototype对象
*/
Car.prototype.output= function () {
    return this.model + "走了" + this.miles + "公里";
};  

var tom = new Car("大叔", 2009, 20000);
var dudu = new Car("Dudu", 2010, 5000);

//这里的output()就是一个单例哟,可以在所有Car对象实例里共享使用。

 


3.不用new来创建对象

(1)用call,改变上下文

function Car(model, year, miles) {
this.model = model;
this.year = year;
this.miles = miles;
// 自定义一个output输出内容
this.output = function () {
return this.model + "走了" + this.miles + "公里";
}
}
var o = new Object();
Car.call(o, "Dudu", 2010, 5000);

//但是用这种方法的话,o不是Car的实例对象
o instanceof Car ; //false

(2)作为函数调用

Car("大叔", 2009, 20000);  //添加到window对象上
console.log(window.year); // 2009 
//因为不用new直接调用函数,this指向的是全局对象window

var tom = Car("大叔", 2009, 20000);
console.log(typeof tom); // "undefined"
console.log(window.output()); // "大叔走了20000公里"

4.强制使用new

function Car(model, year, miles) {
    if (!(this instanceof Car)) {
        return new Car(model, year, miles);
    }
    this.model = model;
    this.year = year;
    this.miles = miles;
    this.output = function () {
        return this.model + "走了" + this.miles + "公里";
    }
}

var tom = new Car("大叔", 2009, 20000);
var dudu = Car("Dudu", 2010, 5000);

console.log(typeof tom); // "object"
console.log(tom.output()); // "大叔走了20000公里"
console.log(typeof dudu); // "object"
console.log(dudu.output()); // "Dudu走了5000公里"

5.原始包装函数

JavaScript里有3中原始包装函数:number, string, boolean,有时候两种都用:  

// 使用原始包装函数
var s = new String("my string");
var n = new Number(101);
var b = new Boolean(true);


// 推荐这种
var s = "my string";
var n = 101;
var b = true;

推荐,只有在想保留数值状态的时候使用这些包装函数,关于区别可以参考下面的代码:

// 原始string
var greet = "Hello there";
// 使用split()方法分割
greet.split(‘ ‘)[0]; // "Hello"
// 给原始类型添加新属性不会报错
greet.smile = true;
// 单没法获取这个值
//原因: console.log(typeof greet.smile); // "undefined" // 原始string var greet = new String("Hello there"); // 使用split()方法分割 greet.split(‘ ‘)[0]; // "Hello" // 给包装函数类型添加新属性不会报错 greet.smile = true; // 可以正常访问新属性 console.log(typeof greet.smile); // "boolean"

  

  

 

 

    

 

入门js设计模式——构造函数模式

原文:http://www.cnblogs.com/shixiaomiao/p/5213937.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!