javascript创建对象(二)

原型模式:每创建一个函数都有一个prototype属性,它是一个指针,指向一个对象;

原型模式创建函数的方式:

function Movie(){

};
Movie.prototype.name="Interstellar";
Movie.prototype.year=2014;
Movie.prototype.country="American";
Movie.prototype.playMovie=function(){
   alert(this.name);
}

var movie1=new Movie();
movie1.playMovie();//Interstellar;
var movie2=new Movie();
movie2.playMovie();//Interstellar;

alert(movie1.playMovie==movie2.playMovie);//true 有别于构造函数

对象字面量的方式

function Movie(){

};
Movie.prototype={
     name:"Interstellar",
     year:2014,
     country:"American",
     playMovie:function(){
       alert(this.name);
}
}
//这种方式原型对象的contructor属性不会指向Movie了,而是指向Object了。

每当代码读取某个属性时,都会先搜索对象实例本身,没有就继续搜索指针指向的原型对象,如果有就结束;通过hasOwnProperty()可以检测属性是存在实例中还是原型中:

function Movie(){
};
Movie.prototype.name="FleetOfTime";
Movie.prototype.year=2014;
Movie.prototype.country="China";
Movie.prototype.playMovie=function(){
   alert(this.name);
}
var movie1=new Movie();
alert(movie1.hasOwnProperty("name"));//原型上的 false
movie1.name="xxxx";
alert(movie1.hasOwnProperty("name"));//覆盖了原型上的,变成实例上的了  true

原型的动态性:对原型对象所做的任何修改都能够立即从实例中反映出来,例:

var movie=new Movie();
Movie.prototype.playOne=function(){
    alert("One");
};
movie.playOne();//"One"

//给Movie原型对象添加了一个方法

但是如果是重写整个原型对象的话,那么就等于切断了构造函数与最初原型之间的联系了:

function Movie(){

}

var movie=new Moive();
//重写原型对象
Movie.prototype={
    constructor:Movie,//对象字面量方式强制指向Movie,本来指向Object
    name:"xxx",
    year:2012,
    country:"xxxx",
    sayName:function(){}
}
//这时候调用sayName()方法会出错
movie.sayName();//error

原型对象的问题:对于包含引用类型值的属性来说,就有很大问题了,如下例子

function Movie(){
}
Movie.prototype={
     constructor:Movie,
     name:"xxx",
     year:2014,
     place:["China","Japan"],
     playName:function(){
         alert(this.name);
}
}
var movie1=new Movie();
var movie2=new Movie();

movie1.place.push("korea");

alert(movie1.place)//"China,Japan,Korea"

alert(movie2.place)//"China,Japan,Korea"

//这里本来是想只改变movie1的place,结果也改到了movie2的

最好的创建对象方式:构造函数来定义实例属性,原型模式来定义方法和共享属性;

function Movie(name,year,country){
     this.name=name;
     this.year=year;
     this.country=country
     this.place=["China","Japan"];
}
Movie.prototype={
       constructor:Movie,
       playName:function(){
              alert(this.name);
}
}

var movie1=new Movie("Interstellar",2014,"American");
var movie2=new Movie("FleetOfTime",2014,"China");
movie1.place.push("Korea");
alert(movie1.place);//"China,Japan,Korea"
alert(movie2.place);//"China,Japan"

alert(movie1.place==movie2.place);//false
alert(movie1.playName==movie2.playName);//true

时间: 2025-01-29 22:16:19

javascript创建对象(二)的相关文章

javascript创建对象之构造函数模式(二)

对上一章节的工厂模式进行代码重写 function Human(name, sex) {             this.name = name;             this.sex = sex;             this.say = function () {                 alert(this.name);             }         }         var man = new Human("汉武大帝", "男&quo

跟我学习javascript创建对象(类)的8种方法_javascript技巧

8中javascript创建对象(类)的方法,依依介绍给大家,希望大家喜欢. 1. 使用Object构造函数来创建一个对象 下面代码创建了一个person对象,并用两种方式打印出了Name的属性值.  var person = new Object(); person.name="kevin"; person.age=31; alert(person.name); alert(person["name"]) 上述写法的另外一种表现形式是使用对象字面量创建一个对象,不

整理JavaScript创建对象的八种方法_javascript技巧

javascript创建对象的方法如下所示: 1. 使用Object构造函数来创建一个对象 下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); person.name="kevin"; person.age=31; alert(person.name); alert(person["name"]) 上述写法的另外一种表现形式是使用对象字面量创建一个对象,不要奇怪person["5

javascript创建对象之工厂模式(一)

工厂模式在软件工程里面是一种比较常见的设计模式了.这种模式抽象了创建具体对象的过程. 上代码: function createHuman(name,sex) {             var obj = new Object();             obj.name = name;             obj.sex = sex;             obj.say = function () {                 alert(this.name);        

javascript创建对象之原型模式(三)

先上代码: function Human() { }         Human.prototype.name = "成吉思汗";         Human.prototype.sex = "男";         Human.prototype.say = function () {             alert(this.name);         }         var man = new Human();         man.say();

javascript创建对象之动态原型模式(五)

动态原型模式是将所有的信息都封装到工造函数中,而构造函数中初始化原型,有保持了同时在使用构造函数和原型的优点. function Human(name, sex) {             this.name = name;             this.sex = sex;             if (typeof this.say != "function") {                 Human.prototype.say = function () {   

JavaScript创建对象的七种方式

JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产.接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点. 工厂模式 function createPerson(name, job) {    var o = new Object()    o.name = name    o.job = job    o.sayName = function() {      console.log(th

Javascript 创建对象方法的总结

原文:Javascript 创建对象方法的总结 最近看了一下<Javascript高级程序设计(第三版)>,这本书很多人都推荐,我也再次郑重推荐一下.看过之后总得总结一下吧,于是我选了这么一个主题分享给大家. 使用Javascript创建对象的方法有很多,现在就来列举一下: 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); person.name="kevin

Javascript生成二维码(QR)

原文:Javascript生成二维码(QR) 网络上已经有非常多的二维码编码和解码工具和代码,很多都是服务器端的,也就是说需要一台服务器才能提供二维码的生成.本着对服务器性能的考虑,这种小事情都让服务器去做,感觉对不住服务器,尤其是对于大流量的网站,虽然有服务器端缓存,毕竟需要大量的CPU运算时间,这或多或少也是很大的一块压力.所以就想,有没有一种不靠服务器,就只靠JS就生成二维码呢,毕竟二维码就是一堆黑白点而已.我也没有刻意去找网络上是否已经存在这样的解决方案,而且自己一直想深入分析二维码的生

JavaScript创建对象的方式小结(4种方式)_javascript技巧

本文实例总结了JavaScript创建对象的方式.分享给大家供大家参考,具体如下: 潜意识里,JavaScript不能算是面向对象的语言,要算也只能说是趋向面向对象的一种语言,至少它不能很好的吻合面向对象最基本的三大特性(继承.封装.多态),当然有很多人就认为JavaScript是面向对象语言,好像也说得没错,因为面向对象也能在JavaScript中实现,比如说继承.封装吧也都可以在JavaScript中实现,但是实现方便吗?所以我觉得很疑惑.看到网上有一网友评价的很好,"面向对象只是一种思想,