博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript中的面向对象(一)
阅读量:5292 次
发布时间:2019-06-14

本文共 4918 字,大约阅读时间需要 16 分钟。

创建对象

工厂模式

用函数封装创建特定对象的细节

function createPerson(name, age, job){
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
}

var person1 = createPerson("Nicholas", 29, "Software Engineer"); var person2 = createPerson("Greg", 27, "Doctor"); person1.sayName();   //"Nicholas" person2.sayName();   //"Greg"

优点:对创建对象的细节进行封装,方便创建多个相似对象

缺点:同一个工厂创建的对象间没有联系;未解决对象识别问题。

构造函数模式

利用构造函数创建对象,不用显式创建对象。new 操作符使得this绑定在新对象上,并且可以用instanceof操作符判断对象的来源。

function Person(name, age, job){        this.name = name;        this.age = age;        this.job = job;        this.sayName = function(){            alert(this.name);        };        }         var person1 = new Person("Nicholas", 29, "Software Engineer");    var person2 = new Person("Greg", 27, "Doctor");    person1.sayName();   //"Nicholas"    person2.sayName();   //"Greg"     alert(person1 instanceof Object);  //true    alert(person1 instanceof Person);  //true    alert(person2 instanceof Object);  //true    alert(person2 instanceof Person);  //true    alert(person1.constructor == Person);  //true    alert(person2.constructor == Person);  //true     alert(person1.sayName == person2.sayName);  //false

优点:解决了对象识别问题

缺点:每个方法要在每个实例上创建一遍

原型模式

function Person(){    }        Person.prototype.name = "Nicholas";    Person.prototype.age = 29;    Person.prototype.job = "Software Engineer";    Person.prototype.sayName = function(){        alert(this.name);    };        var person1 = new Person();    person1.sayName();   //"Nicholas"        var person2 = new Person();    person2.sayName();   //"Nicholas"      alert(person1.sayName == person2.sayName);  //true        alert(Person.prototype.isPrototypeOf(person1));  //true    alert(Person.prototype.isPrototypeOf(person2));  //true        //only works if Object.getPrototypeOf() is available    if (Object.getPrototypeOf){        alert(Object.getPrototypeOf(person1) == Person.prototype);  //true        alert(Object.getPrototypeOf(person1).name);  //"Nicholas"    }

优点:实例之间共享原型的属性和方法

缺点:以对象字面量方法重写原型对象会切断之前所创建的对象与构造函数的联系;对象字面量重写原型时需加上constructor属性。
注意:1.对对象某属性进行赋值以外的操作时会发生标识符解析,若该属性只存在于原型中且为引用,操作将改变引用指向的对象。如下:
function Person(){}
Person.prototype.name = ["Nicola"];
Person.prototype.age = 18;
var person1 = new Person();
var person2 = new Person();
person1.name.push("Alice");
console.log(person1.name);//["Nicola","Alice"]
console.log(person2.name);//["Nicola","Alice"]
而如果是赋值操作,则不能改写原型中的值,而是新增一个该对象的同名属性。如下:
function Person(){}
Person.prototype.name = ["Nicola"];
Person.prototype.age = 18;
var person1 = new Person();
var person2 = new Person();
person1.name = ["Alice"];
console.log(person1.name);//["Alice"]
console.log(person2.name);//["Nicola"]
delete person1.name;
console.log(person1.name);//["Nicola"]
2.可通过hasOwnProperty方法判断某属性属于对象自己还是原型。
3.最好不要给原生对象添加原型方法。

组合使用构造函数和原型

function Person(name, age, job){        this.name = name;        this.age = age;        this.job = job;        this.friends = ["Shelby", "Court"];    }        Person.prototype = {        constructor: Person,        sayName : function () {            alert(this.name);        }    };        var person1 = new Person("Nicholas", 29, "Software Engineer");    var person2 = new Person("Greg", 27, "Doctor");        person1.friends.push("Van");        alert(person1.friends);    //"Shelby,Court,Van"    alert(person2.friends);    //"Shelby,Court"    alert(person1.friends === person2.friends);  //false    alert(person1.sayName === person2.sayName);  //true

动态原型模式

把所有信息封装到构造函数中,在构造函数中初始化原型,是一种让有其它OO语言经验的开发人员更方便的语法糖。

function Person(name, age, job){

//properties        this.name = name;        this.age = age;        this.job = job;                //methods        if (typeof this.sayName != "function"){                    Person.prototype.sayName = function(){                alert(this.name);            };                    }    }    var friend = new Person("Nicholas", 29, "Software Engineer");    friend.sayName();

优点:方便有其它OO语言经验的开发人员上手。

缺点:同组合模式。

寄生构造函数模式

本质是工厂模式,只不过通过new操作符调用函数。。主要用来扩展原生对象,其实还是语法糖。

function SpecialArray(){

//create the array        var values = new Array();                //add the values        values.push.apply(values, arguments);                //assign the method        values.toPipedString = function(){            return this.join("|");        };                //return it        return values;            }        var colors = new SpecialArray("red", "blue", "green");    alert(colors.toPipedString()); //"red|blue|green"    alert(colors instanceof SpecialArray);

优点:可以像使用原生构造函数一样使用特殊构造函数创建经过扩展后的新对象,并不会影响到原生对象。

缺点:同工厂模式。

稳妥构造函数模式

实例方法不引用this,不使用new调用构造函数。

function Person(name, age, job){
var o = new Object();
o.sayName = function(){
alert(name);
};
return o;
}

var person1 = Person("Nicholas", 29, "Software Engineer"); person1.sayName();   //"Nicholas"

优点:除了特定方法没有其它访问构造函数传入参数的途径。

缺点:同工厂模式。

转载于:https://www.cnblogs.com/shuyzhou/p/5895426.html

你可能感兴趣的文章
Delphi中ListView类的用法
查看>>
bzoj3110: [Zjoi2013]K大数查询 【树套树,标记永久化】
查看>>
[原创]Java 的传值小例子
查看>>
博客第一弹—聊聊HTML的那些事
查看>>
Mysql安装方法及安装问题解决
查看>>
Java动态代理的两种实现方式:
查看>>
PHP trait
查看>>
python 多线程并发threading & 任务队列Queue
查看>>
1_fbauto
查看>>
IO体系、集合体系、多线程、jdbc
查看>>
关于时间:UTC/GMT/xST/ xDT
查看>>
[51Nod1089] 最长回文子串 V2(Manacher算法)
查看>>
Asp.Net生命周期系列六
查看>>
php引用 =& 详解
查看>>
Codeforces 914D Bash and a Tough Math Puzzle (ZKW线段树)
查看>>
POJ 3009: Curling 2.0
查看>>
DLNA介绍(包含UPnP,2011/6/20 更新)
查看>>
ANGULARJS5从0开始(2) - 整合bootstrap和font-awesome
查看>>
Android 使用Parcelable序列化对象
查看>>
Python Web框架Django (零)
查看>>