首頁 > web前端 > js教程 > JS原型動態特性實作方法

JS原型動態特性實作方法

小云云
發布: 2018-03-28 17:24:46
原創
1489 人瀏覽過

在學習JS的時候,我遇到了函數和實例物件對原型修改的相關問題,與大家共分享,希望能幫助大家。

範例1:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型的动态特性1</title>
</head>
<body>
</body>
<script>
// 创建一个函数
var Person = function() {};

// 给函数的原型添加一个方法
Person.prototype.say = function() {
console.log("下雪的季节...");
};

// 创建第一个实例对象
var p1 = new Person();

// 修改原型中的方法(true)
Person.prototype = {
say: function() {
console.log("一个人的女团...");
}
};

// 创建第二个实例对象
var p2 = new Person();

// 打印p1与p2中的say方法
p1.say(); /* 下雪的季节 */
p2.say(); /* 一个人的女团 */
</script>
</html>
登入後複製

在案例中,使用了Person.prototype對原型進行了重定向,舊原型與函數斷絕了關係,函數的原型只想新原型,所以新建立的實例物件p2列印出來的是「一個人的女團」

範例2:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型的动态特性2</title>
</head>
<body>
</body>
<script>
// 创建一个函数
var Person = function() {};

// 给函数的原型添加一个方法
Person.prototype.say = function() {
console.log("下雪的季节...");
};

// 创建第一个实例对象
var p1 = new Person();

// 修改p1原型中的方法(false)
p1.prototype = {
say: function() {
console.log("一个人的女团...");
}
};

// 创建第二个实例对象
var p2 = new Person();

// 打印p1与p2中的say方法
p1.say(); /* 下雪的季节 */
p1.prototype.say();/* 一个人的女团,此处调用的是实例对象自己的prototype属性中的方法 */
p2.say(); /* 下雪的季节 */
</script>
</html>
登入後複製

在案例中,p1.prototype無法對函數和其自己的原型進行重定向,只是為自己添加了一個prototype屬性。所以p1.say() 與p1.prototype.say() 印出來結果不一致

#範例3:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型的动态特性2</title>
</head>
<body>
</body>
<script>
// 创建一个函数
var Person = function() {};

// 给函数的原型添加一个方法
Person.prototype.say = function() {
console.log("下雪的季节...");
};

// 创建第一个实例对象
var p1 = new Person();

// 修改p1原型中的方法(true)
p1.__proto__ = {
say: function() {
console.log("一个人的女团...");
}
};

// 创建第二个实例对象
var p2 = new Person();

// 打印p1与p2中的say方法
p1.say(); /* 一个人的女团 */
p1.__proto__.say();/* 一个人的女团 */
p2.say(); /* 下雪的季节 */
</script>
</html>
登入後複製

##在案例中,使用了p1.__proto__對p1的原型進行了重定向,所以p1與p2中的say()打印出來的不同了

從三個案例中,我得出以下幾個結論:

(1) 函數名稱.prototype可以對函數的原型進行重定向,舊原型與函數會斷絕關係

(2) 物件名稱.prototype無法對函數的原型進行重定向,只會為實例物件新增一個prototype屬性(若實例物件沒有prorotype屬性的情況)

(3) 物件名稱.__proto__能對該物件的原型進行重定向,但是無法改變函數創建出來的其他實例物件的原型

(4) prototype為函數名調用,可以對原型進行重定向

(5) __proto__為物件名稱調用,可以對該物件的原型進行重定向,但是不影響函數和其他實例物件的原型。

以上是JS原型動態特性實作方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板