Js中的prototype

简介:    最近新入职了一家公司,周五看代码的时候,发现他们页面上的js是这样纸的,我当时的心情是莫名其妙的:好吧,入乡随俗。prototype通俗的用法,就是向对象添加属性跟方法。/* javascript中的每个对象都有prototype属性,js中对象的prototype属性的解释是,返回对象类型原型的引用。


   最近新入职了一家公司,周五看代码的时候,发现他们页面上的js是这样纸的,我当时的心情是莫名其妙的:




好吧,入乡随俗。


prototype通俗的用法,就是向对象添加属性跟方法。


/*
  javascript中的每个对象都有prototype属性,js中对象的prototype属性的解释是,返回对象类型原型的引用。
  A.prototype=new B();
  理解prototype不应把它和继承混淆。
  这里强调的是克隆而不是继承。


 */
function People(name){
  this.name=name;
  //对象方法
  this.Introduce=function(){
    alert("my name is "+this.name);
  }
}

//类方法
People.Run=function(){
  alert("i am running...");
}

//原型方法
People.prototype.IntroduceChinese=function(){
  alert("我的名字是:"+this.name);
}

//测试
var p1=new People("lhc");
p1.Introduce();
People.Run();
p1.IntroduceChinese();

通过prototype,起到了一个克隆方法的作用。


下面来瞅瞅使用原型的时候,可能会遇到的问题。


问题一:扩展类与对象实例具有相同的方法,调用时候会调用哪一个?



function baseClass(){
  this.showMsg=function(){
    alert("baseClass:showMsg");
  }
}

function extendClass(){
  this.showMsg=function(){
    alert("extendClass::showMsg");
  }
}

extendClass.prototype=new baseClass();
var instance=new extendClass();
instance.showMsg();//extendClass::showMsg

结论: 函数运行时会先去本体的函数中去找,如果找到则运行,找不到则去prototype中寻找函数。或者可以理解为prototype不会克隆同名函数。






目录
相关文章
|
前端开发 JavaScript
【JavaScript原型链prototype详解】
在JavaScript中,每个对象都有一个原型(prototype)属性,它指向另一个对象。这个被指向的对象也有自己的原型,以此类推,最终形成了一个原型链。原型链的顶端是Object.prototype,它是所有对象的根原型。 当我们访问一个对象的属性时,如果该对象自身没有这个属性,JavaScript会沿着原型链向上查找,直到找到匹配的属性或者到达原型链的末端。
137 0
【JavaScript原型链prototype详解】
|
JavaScript 前端开发
CocosCreator 面试题(二)JavaScript中的prototype的理解
CocosCreator 面试题(二)JavaScript中的prototype的理解
223 0
|
1月前
|
JavaScript 前端开发
JavaScript - 测试 Prototype
JavaScript - 测试 Prototype
11 0
|
2月前
|
JavaScript 前端开发
JavaScript prototype(原型对象)
JavaScript prototype(原型对象)
32 0
|
2月前
|
JavaScript 前端开发
JavaScript基础知识-原型(prototype)
关于JavaScript基础知识中原型(prototype)概念的介绍。
37 1
|
6月前
|
JavaScript 前端开发
在JavaScript中,函数原型(Function Prototype)是一个特殊的对象
【5月更文挑战第11天】JavaScript中的函数原型是一个特殊对象,它为所有函数实例提供共享的方法和属性。每个函数在创建时都有一个`prototype`属性,指向原型对象。利用原型,我们可以向所有实例添加方法和属性,实现继承。例如,我们定义一个`Person`函数,向其原型添加`greet`方法,然后创建实例`john`和`jane`,它们都能调用这个方法。尽管可以直接在原型上添加方法,但推荐在构造函数内部定义以封装数据和逻辑。
57 2
|
6月前
|
JavaScript 前端开发 开发者
【专栏】JavaScript 中的 prototype 和__proto__是关乎对象继承和属性查找的关键概念
【4月更文挑战第29天】JavaScript 中的 prototype 和__proto__是关乎对象继承和属性查找的关键概念。prototype 是函数属性,用于实现对象继承,方法和属性定义在其上可被所有实例共享。__proto__是对象属性,实现属性查找机制,当对象自身找不到属性时,会沿原型链向上查找。两者关系:__proto__指向构造函数的 prototype,构成对象与原型的桥梁。虽然 prototype 可直接访问,但__proto__由引擎内部维护,不可见。理解两者区别有助于深入学习 JavaScript。
94 1
|
6月前
|
JavaScript
JS原型对象prototype
JS原型对象prototype
|
6月前
|
JavaScript 前端开发
JavaScript基础知识:什么是原型链(Prototype Chain)?
JavaScript基础知识:什么是原型链(Prototype Chain)?
52 2
|
6月前
|
JavaScript 前端开发 Java
JavaScript难点:原型、原型链、继承、new、prototype和constructor
JavaScript 不像 Java、C++ 这种纯面向对象的语言,可以通过类实现继承,JavaScript中的继承是通过原型实现的,即使 ES6 中新增的 class 类也只是原型的语法糖而已
80 4