JS学习笔记:函数原型、原型链、构造函数

function foo() {    
    this.name = 'andy'  ;  
    let vvv = 'vvvvvvvvvvv' ;   
    foo.watermelon = '西瓜'  ; 
    foo.prototype.sex = 'GG' ;   
}    
foo.banana = '香蕉'  ; 
foo.prototype.test = 'test' ; 
let foo1 = new foo(); // `foo1`;上有哪些属性,这些属性分别挂载在哪个地方 ?   
foo.prototype.test = 'test2'; // 重新赋值

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

思考之后再看解释:

function foo() {    
    this.name = 'andy'    //foo对象本身的属性
    let vvv = 'vvvvvvvvvvv'    //foo对象体的变量而已,跟foo没啥关系
    foo.watermelon = '西瓜'    //此方式是设置为foo的静态属性,只能通过foo.obkoro1 调用,跟foo的实例没关系
    foo.prototype.sex = 'GG'    //设置foo原型属性,其挂载在原型对象上即:foo.prototype对象上(foo.prototype是个对象,每个函数都有)
}    
foo.banana = '香蕉'    //也是声明静态属性,必须按foo.banana 才能调用,用实例是访问不到的
foo.prototype.test = 'test'    //设置原型对象属性
let foo1 = new foo() // `foo1`上有哪些属性,这些属性分别挂载在哪个地方 ?   
foo.prototype.test = 'test2' // 重新赋值

答案:

console.log(foo1);//输出以下:

========= 输出结果 ========

  1. foo {name: "andy"}
    1. name: "andy"  //普通属性
    2. __proto__: Object  //原型对象

========= 输出结果 ========

用鼠标点开 __proto__ 可以发现 :

  1. sex: "GG"
  2. test: "test2"

 

console.log(foo.banana);//输出 香蕉 证明是静态属性
console.log(foo.watermelon);//输出 西瓜 证明是静态属性

foo1 只有一个属性:name=andy

foo1 的原型对象上有 sex=GG  和 test=test 原型对象属性

而banana 和 watermelon 在foo的静态对象上,foo1和其原型对象上是没有的。

end......

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章