Heim  >  Artikel  >  Web-Frontend  >  javascript学习笔记(九) js对象 设计模式_基础知识

javascript学习笔记(九) js对象 设计模式_基础知识

WBOY
WBOYOriginal
2016-05-16 17:52:25862Durchsuche

1.创建对象

复制代码 代码如下:

var person = new Object();
person.name = "RuiLiang";
person.age = 30;
person.job = "Teacher";
person.sayName = function () {
alert(this.name);
};

person.sayName();

2.工厂模式
缺点:不能识别对象

复制代码 代码如下:


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("阿亮",30,"教师");
var person2 = createPerson("俊俊",24,"待业");

person1.sayName(); //"阿亮"
person2.sayName(); //“俊俊”

3.构造函数模式
缺点:缺少封装性

复制代码 代码如下:

function Person(name,age,job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = sayName;
}
function sayName() {
alert(this.name);
}

var person1 = new Person("阿亮",30,"教师");
var person2 = new Person("俊俊",24,"待业");
person1.sayName();
person2.sayName();

4.原型模式
缺点:所有属性被实例共享

复制代码 代码如下:

function Person() {
}

Person.prototype.name = "ALiang";
Person.prototype.age = 30;
Person.prototype.job = "Teacher";
Person.sayName = function () {
alert(this.name);
}

hasOwnProperty()方法检测某一属性是不是实例属性,如果是返回 true

person1.hasOwnProperty("name"); //name是不是person1的属性
in 操作符:通过对象访问的属性是否存在,若存在返回 true,不管属性存在实例中还是原型中

alert("name" in person1); //name属性若存在返回 true
确定属性在原型中还是对象中的方法:

复制代码 代码如下:

function hasPrototypeProperty(object,name) {
return !object.hasOwnProperty(name) && (name in object);
}
//用法
var person = new Person();
alert(hasPrototypeProperty(person,"name")); //true
person.name = "Grey"; //改变原型中name的值
alert(hasPrototypeProperty(person,"name")); //false

isPrototypeOf()方法是用来判断指定对象object1是否存在于另一个对象object2的原型链中,是则返回true,否则返回false。
格式如下:
object1.isPrototypeOf(object2);
object1是一个对象的实例;
object2是另一个将要检查其原型链的对象。
原型链可以用来在同一个对象类型的不同实例之间共享功能。
如果 object2 的原型链中包含object1,那么 isPrototypeOf 方法返回 true。
如果 object2 不是一个对象或者 object1 没有出现在 object2 中的原型链中,isPrototypeOf 方法将返回 false。

复制代码 代码如下:

//字面量重写原型对象
function Person(){
}

Person.prototype = {
constructor : Person,
name : "ALiang",
age : 30,
job : "Teacher",
sayName : function() {
alert(this.name);
}
};

5.构造函数和原型混合模式
具有构造函数模式和原型模式的优点,属性用构造函数模式,方法用原型模式 //这种模式使用最广泛
复制代码 代码如下:

function Person(name,age,job) {
this.name = name;
this.age = age;
this.job = job;
this.friends = ["xuyun","wuxueming"];
}
Person.prototype = {
constructor : Person,
sayName : function() {
alert(this.name);
}
};

var person1 = new Person("ALiang",30,"Teacher");
var person2 = new Person("ZuNan",26,"Teacher");
person1.friends.push("JunJun");
alert(person1.friends); //"xuyun","wuxueming","JunJun"
alert(person2.friends); //"xuyun","wuxueming"

6.动态原型模式

复制代码 代码如下:

function Person(name,age,job) {
this.name = name;
this.age = age;
this.job = job;

if (typeof this.sayName != "function"){ //这里的sayName可以是任何初始化后存在的方法或属性
Person.prototype.sayName = function() { //不能用字面量形式
alert(this.name);
};
}

7.寄生构造函数模式
8.稳妥构造函数模式
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn