码迷,mamicode.com
首页 > 编程语言 > 详细

javaScript-原型

时间:2016-04-27 01:32:52      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:

为什么会有原型这个概念,先看js 之前创建对象的方式存在的问题;

创建对象方式

1、字面量

var obj={name:"join",age:18}

var obj1={name:"Tom",age:88}

当我们需要创建多个属性一样只有值不一样的对象时,这种方式就悲剧来了,会造成大量的冗余代码,最重要的是代码不能复用;

2、工厂模式

这种工厂模式并不是设计模式中的工厂方法,代码如下:

    function createObj(name, age) {
        var o = new Object();
        o.name = name;
        o.age = age;
        o.sayHello= function() {
            alert("Hello Word!");
        }
        return o;
    }

    var obj = createBlog("Tom", "88");

这种方式好多了,但是也存在一个问题,就是没办法知道一个对象是什么类型;console.log(typeof obj);//object

3、构造函数模式


function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
this.sayNmae=function(){
alert(this.name);
}
}
var persong1=new Person("Join",18,"农民");
var persong2=new Person("Join",18,"地主");

构造函数模式看起来oop(面向对象)多了,上面两种模式存在的问题在构造模式中都不存在了(创建对象的代码可以复用、对象类型可以识别)看起来世界挺美好,遗憾的是

这种还是存在一个问题;

1、每一个方法都要在每个实例上重新创建一次;

2、从上面例子可以看出每个person 实例都包含一个不同的function 实例;不要忘了ECMAScript中的函数也是对象,所以上面的代码与下面的代码等价

    function Person(name,age,job){
        this.name=name;
        this.age=age;
        this.job=job;
        this.sayNmae=new function(){
            alert(this.name);
        }
    }
alert(person1.sayNmae==person2.sayNmae)// false
当然这个问题也是能解决的,就是把方法移到外面,让他成为全局的函数,但是这样一来该函数就只能由widows对象调用了,而且如果存在多个方法,就会存在多个全局函数,那我们自定义的的引用类型
就丝毫没有封装可言了。
好在这些问题都可言通过原型模式来解决;
说了一大堆废话进入正题:原型

function特征

在js中一切都是对象,当我们写function 时js 引擎会创建一个对象,这个对象包含一个属性prototype(原型),这个属性是一个指针,该指针指向原型对象,

该对象的作用是特定类型的所有实例共享属性和方法;

function Person(name,age,job){

this.name=name;
this.age=age;
this.job=job;
}
Person.prototype.sayNmae=function(){
alert(this.name);
}
var persong1=new Person("Join",18,"农民");
var persong2=new Person("Join",18,"地主");

alert(persong1.sayNmae==persong2.sayNmae)// true

 

Prototype对象

在默认情况下所有原型对象都会自动获得一个属性Constructor(构造函数属性)这个属性包含一个指向prototype属性所在的函数指针;

待续...

javaScript-原型

标签:

原文地址:http://www.cnblogs.com/CandyManPing/p/5437229.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!