javascript 의 계승 실례

5201 단어 JavaScript
shape.prototype = {
    getEdge:function(){
        return this.edge;
    },
    getArea:function(){
        return this.a*this.b;
    }
}
function shape(edge, a, b)
{
    this.edge = edge;
    this.a = a;
    this.b = b;
}

//       
triangle.prototype = new shape();
triangle.prototype.getName = function(){alert('I am a triangle');}
function triangle(bottom ,height)
{
    shape.call(this, 3, bottom ,height);
}


//       
rectangle.prototype = new shape();
rectangle.prototype.getName = function(){alert('I am a rectangle');}
rectangle.prototype.getArea = function(){alert('I rewrite parent getArea method');}
function rectangle(bottom ,height)
{
    shape.call(this, 4, bottom ,height);
}

var t = new triangle(10, 5);

var r = new rectangle(10, 5);


console.dir(r);

 
계승 에 있어 서 자바 script 의 모든 대상 은 내부 개인 링크 가 다른 대상 을 가리 키 거나  null) 이 대상 은 바로 원래 대상 의 원형 이다. 이 원형 도 자신의 원형 이 있 는데 대상 의 원형 이 null 일 때 까지 이런 1 급 체인 구 조 를 원형 체인 이 라 고 부른다.
원형 체인 기반 계승
javascript 대상 은 두 가지 서로 다른 속성 이 있 습 니 다. 하 나 는 대상 자체 의 속성 이 고 다른 하 나 는 원형 체인 에 계승 되 는 속성 입 니 다. 아래 코드 는 한 대상 의 속성 을 방문 할 때 무슨 일이 일 어 났 는 지 보 여 줍 니 다.
 
//         o,  o        :
// {a:1, b:2} ---> {b:3, c:4} ---> null
// 'a' 'b' o     .

//    , "  .[[Prototype]]"          .
//             (ECMAScript        ),          .

console.log(o.a); // 1
// a o      ?  ,      1

console.log(o.b); // 2
// b o      ?  ,      2
// o.[[Prototype]]     'b'  ,         .      "    ".

console.log(o.c); // 4
// c o      ?  ,   o.[[Prototype]]    .
// c o.[[Prototype]]      ?  ,      4
console.log(o.d); // undefined
// d o      ?  ,   o.[[Prototype]]    .
// d o.[[Prototype]]      ?  ,   o.[[Prototype]].[[Prototype]]    .
// o.[[Prototype]].[[Prototype]] null,       ,  d  ,  undefined

 
             ,       ,               。  ,                   。

 
더 자세 한 상속 소개: http://www.cnblogs.com/sanshi/archive/2009/07/08/1519036.html
MDN 계승 소개: https://developer.mozilla.org/zh-CN/docs/JavaScript/Guide/Inheritance_and_the_prototype_chain

좋은 웹페이지 즐겨찾기