JavaScript中原型的定义方式是通过 Object.prototype 对象来实现的,该对象是一个全局对象。在JavaScript编程中,原型中的方法和属性会被对象所继承。在这里,我们可以通过一个例子来理解原型:
var Person = function(name, age){
this.name = name;
this.age = age;
}
Person.prototype.getName = function(){
return this.name;
}
Person.prototype.getAge = function(){
return this.age;
}
var personObj = new Person("John", 21);
在这个例子中,我们定义了一个Person构造函数,并将其两个属性分别用this关键字定义为对象属性,而我们为Person函数添加了两个方法:getName 和 getAge。这两个方法都通过 Person.prototype 来实现。
在这里,我们不使用this关键字来定义getName和getAge属性,而是使用了原型对象的属性来定义。因为这样可以实现代码的复用,当我们将getName和getAge定义为对象属性时,每次都需要将这两个属性赋值。当我们将这两个方法添加到原型中后,它们就可以被personObj所继承。
接下来,我们通过以下代码来测试 personObj 对象是否继承了 Person 原型对象:
console.log(personObj.getName()); // John
console.log(personObj.getAge()); // 21
在这里,我们输出了 personObj 对象的姓名和年龄属性,它们都是从Person.prototype中继承来的。
除了使用原型来添加属性和方法之外,原型还可以用于实现继承。在JavaScript中,继承可以通过原型链的方式来实现。原型链是指一个对象可以通过它的原型对象引用其他对象的属性和方法。在JavaScript中,所有的对象都有一个原型对象。
下面是一个使用原型链实现继承的例子:
var Bird = function(name){
this.name = name;
}
Bird.prototype.fly = function(){
return "I can fly";
}
var Penguin = function(name){
this.name = name;
}
Penguin.prototype = Object.create(Bird.prototype);
var penguinObj = new Penguin("Pengy");
console.log(penguinObj.name); // Pengy
console.log(penguinObj.fly()); // I can fly
console.log(penguinObj.constructor); // Bird
console.log(penguinObj instanceof Penguin); // true
console.log(penguinObj instanceof Bird); // true
在这个例子中,我们定义了两个构造函数:Bird和Penguin。Bird构造函数中包含一个属性和一个方法。Penguin构造函数通过指定其原型对象为Bird.prototype来实现了继承。这意味着Penguin的实例可以访问Bird的属性和方法。
在这里,我们创建了一个penguinObj实例,该实例中包含了Bird构造函数中定义的属性和方法。此时,我们使用 console.log 输出 penguinObj 实例的属性和方法进行测试。在这里,我们将会看到输出:Pengy、I can fly、Bird、true 和 true。
我们可以发现,penguinObj对象继承了 Bird.prototype 中的所有属性和方法。由于Penguin对象的构造函数原型设置为了 Bird.prototype,因此 penguinObj的 constructor 属性为 Bird。此外,通过 instanceof 操作符,我们可以检查penguinObj对象是不是Penguin或者Bird的一个实例。
在总结中,本文介绍了JavaScript中的原型,展示了如何使用原型在对象中添加属性和方法,以及如何使用原型来实现继承。原型链是JavaScript中原型对象的重要概念,我们还通过一个例子来展示了如何使用原型链来实现继承。这些技术可以提高代码的简洁性和可读性,使代码更加易于维护。
上一篇:javascript中变量名
下一篇:javascript中制作图片代替









