原型和原型链的理解和使用

1、对象字面量是一个 名/值 对列表,每个 名/值 对之间用逗号分隔,最后用一个大括号括起来。名/值对 表示对象的一个属性或方法,名和值之间用冒号分隔。

/**
* @author zhanghua
*/
var literal = {
    add: function(){
        alert("add");
    },
    del: function(){
        alert("delete");
    },
    update: function(){
        alert("update");
    },
    name: "zhangsan",
    callLiteral: function(){
        // 对于当前字面量对象的调用,要加this关键字
        this.add();
    }
};

2、首先为一个对象定义构造函数,为对象的属性赋值。这里面的属性是自定义属性。

var BaseCalculator = function() {    this.decimalDigits = 2;};

3、原型使用的两种方式:

(1) 通过对象字面量给Calculator的prototype属性赋值:

BaseCalculator.prototype = {    add: function(x, y) {        return x + y;    },    subtract: function(x, y) {        return x - y;    }};
(2)通过立即执行函数为prototype赋值,可以达到方法的私有化:
BaseCalculator.prototype = function () {            add = function (x, y) {                return x + y;            },

subtract = function (x, y) {                return x - y;            }            return {                add: add,                subtract: subtract            }        } ();
(3) 
Calculator.prototype = BaseCalculator.prototype;  Calculator的实例只能访问BaseCalculator原型中的方法和属性,不能访问构造函数中的属性。
Calculator.prototype = new BaseCalculator();      Calculator的实例既能访问BaseCalculator原型中的方法和属性,也能访问构造函数中的属性。
 

(4)重写原型:在使用第三方JS类库的时候,往往有时候他们定义的原型方法是不能满足我们的需要,但是又离不开这个类库,所以这时候我们就需要重写他们的原型中的一个或者多个属性或function

Calculator.prototype.subtract = function(x, y, z){return x + z –y;};

(5) 原型链: 是由子对象对父对象进行多次原型继承形成的链式关系。当调用子对象的某个属性或方法时,javascript会向上遍历原型链,直到找到为止,没有返回undefined。但是注意: 属性在查找的时候是先查找自身的属性,如果没有再查找原型,再没有,再往上走,一直插到Object的原型上。

(6) hasOwnProperty函数: 是Object.prototype的一个方法,它能够查找一个对象是否包含自定义属性而不是原型链的属性。可以对 for in 进行过滤。 但是注意: 最好使用{}.hasOwnProperty方式先除去

某个对象中可能包含的对hasOwnProperty属性非法占用。

以上参考大牛博客:  http://www.cnblogs.com/TomXu/archive/2012/01/05/2305453.html

时间: 2024-10-22 19:30:16

原型和原型链的理解和使用的相关文章

理解javascript原型与原型链

想要学习javascript中的面向对象编程(oop),首先就要了解原型及原型链. 先来个例子,了解原型 1 function Foo(y){ 2 this.y = y; 3 } 4 Foo.prototype.x = 10; 5 Foo.prototype.calculate = function(z){ 6 return this.x+this.y+z; 7 }; 8 var b = new Foo(20); 9 alert(b.calculate(30)); js中除了基本数据类型,一切皆

【JavaScript】深入理解JavaScript之强大的原型和原型链

由于JavaScript是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链. AD: hasOwnProperty函数: hasOwnProperty是Object.prototype的一个方法,它可是个好东西,他能判断一个对象是否包含自定义属性而不是原型链上的属性,因为hasOwnProperty 是 JavaScript 中唯一一个处理属性但是不查找原型链的函数. // 修改Object.prototype Object.p

对原型链的理解 语言表达能力不好 直接用代码,哈

分享一下 我对原型和原型链的理解 原型对象: function People(nameValue,ageValue,fondValue)            {                this.name = nameValue;                this.age = ageValue;                this.fond = fondValue;            } People.prototype.rule = function()         

前端基本知识(二):JS的原型链的理解

之前一直对于前端的基本知识不是了解很详细,基本功不扎实,但是前端开发中的基本知识才是以后职业发展的根基,虽然自己总是以一种实践是检验真理的唯一标准,写代码实践项目才是唯一,但是经常遇到知道怎么去解决这个问题,但是不知道使用的是什么一种方法,方法的原理是什么,现在觉得大学里学习的基本知识还是很重要的,一定有自己的理解才能走的更远. 无论以后自己的学习新的技术,但是万变不离其宗,基本扎实,学习效率高. 废话这么多,开始了今天理解的四部分部分. 一.JS的原型链理解方式 二.原型理解 三.规则 四.j

Javascript-我对作用链、闭包、原型及原型链的理解

Javascript-基础概念总结(2) 最近学习一些javascript基础知识,也解决了很多之前的疑惑,记得第一次被问及怎样理解闭包时,我的回答是:就是类似于封装吧!现在想想是有多白痴,学习技术是需要逻辑性很强的,技术注重用事实和数据说话,每一点都需要理解透彻,在技术上没有猜测,没有套路,以后自己在回答技术性的问题时,应做到知道就是知道,不理解或不太明白的,就诚实对待,这样有助于自己积累知识,了解自己的不足,从而提升自己.讲了那么多题外话,是为了让自己认识到应真诚的对待学习.下面是一些我的知

JS原型、原型链深入理解

原型是JavaScript中一个比较难理解的概念,原型相关的属性也比较多,对象有”prototype”属性,函数对象有”prototype”属性,原型对象有”constructor”属性. 一.初识原型在JavaScript中,原型也是一个对象,通过原型可以实现对象的属性继承,JavaScript的对象中都包含了一个”[[Prototype]]”内部属性,这个属性所对应的就是该对象的原型.“[[Prototype]]”作为对象的内部属性,是不能被直接访问的.所以为了方便查看一个对象的原型,Fir

<深入理解JavaScript>学习笔记(5)_强大的原型和原型链

前言 JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型. (prototypal :原型.学好英语还是很重要的) 虽然这经常被当作是 JavaScript 的缺点被提及,其实基于原型的继承模型比传统的类继承还要强大.实现传统的类继承模型是很简单,但是实现 JavaScript 中的原型继承则要困难的多. 由于 JavaScript 是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链. 原型

javascript 原型及原型链的初步理解

最近折腾了好久,终于是把js里面的原型和原型链做了个初步的理解: 在这里,我打个比喻: 我(child),我妈constructor(构造函数)生了我:别人问我老妈跟谁生的我,于是此时我妈会指向我爸爸(father),即constructor.prototype=father. 而我的爸爸可以表示为:child.__proto__;故又有了constructor.prototype===child.__proto__: 这时候,有人会问,__proto__这是什么,这就是构成原型链的一个引用,如

深入理解JavaScript系列(5):强大的原型和原型链

前言 JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型. 虽然这经常被当作是 JavaScript 的缺点被提及,其实基于原型的继承模型比传统的类继承还要强大.实现传统的类继承模型是很简单,但是实现 JavaScript 中的原型继承则要困难的多. 由于 JavaScript 是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链. 原型 10年前,我刚学习JavaScript的时候,一般都是用

原型链的理解

### 原型链的理解 #### 概念 + javascript每一个对象**包括原型对象**都有一个内置的`proto`属性指向创建他的函数对象的原型对象,即`prototype`属性 #### 作用 + 实现对象的继承 ### 理解 1.函数对象 + 在javascript中,函数就是对象 2.原型对象 + 当定义一个函数对象的时候,会包含一个预定的属性,`prototype`,这就属性称之为原型对象 3.\__proto__ + javascript 在创建对象的时候,都会有一个\_prot