1.課程目標:
1.1:原型怎么寫？
1.2:prototype的特點是什么？
1.3：物件的三角戀關系是怎么樣的？
形式：
建構式名.prototype=
{
函式名:function()
{
console.log("原型的寫法");
}
}
2.原型怎么寫？
原型怎么寫？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
/*let fns={
mySay:function()
{
console.log("7");
}
}*/
function Person(myName, myAge)
{
this.name = myName;
this.age = myAge;
//this.say=fns.mySay;
//可以簡化為:
/*this.say=function()
{
console.log("7");
}*/
}
Person.prototype={
say:function()
{
console.log("666");
}
};
let obj1 = new Person("lnj", 34);
obj1.say();
let obj2 = new Person("zs", 44);
obj2.say();
console.log(obj1.say === obj2.say); // true，因為都是在同一個原型里面找到的.構造方法里面沒有say函式.
</script>
</body>
</html>
總結：
1.創建物件后,建構式里面找不到就去原型里面找.
效果：
2.prototype的特點是什么？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>99-JavaScript-prototype特點</title>
<script>
function Person(myName, myAge) {
this.name = myName;
this.age = myAge;
this.currentType = "建構式中的type";
this.say = function () {
console.log("建構式中的say");
}
}
Person.prototype = {
currentType: "人",
say: function () {
console.log("hello world");
}
}
let obj1 = new Person("lnj", 34);
obj1.say();
console.log(obj1.currentType);
let obj2 = new Person("zs", 44);
obj2.say();
console.log(obj2.currentType);
</script>
</head>
<body>
</body>
</html>
總結：
1.記住,是構造方法里面沒有才去原型里面找的哈,比如我有錢我為什么要去借錢是吧.
效果：
3：物件的三角戀關系是怎么樣的？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>100-JavaScript-物件三角戀關系</title>
<script>
function Person(myName, myAge) {
this.name = myName;
this.age = myAge;
}
let obj1 = new Person("lnj", 34);
//這里代表的都是指向哪里的哈.
console.log(Person.prototype);
console.log(Person.prototype.constructor);
console.log(obj1.__proto__);
</script>
</head>
<body>
</body>
</html>
總結：
每個“建構式”中都有一個默認的屬性，叫做prototype，prototype屬性保存著一個物件，這個物件我們稱之為“原型物件”，
每個“原型物件”中都有一個默認的屬性，叫做constructor ， constructor指向當前原型物件對應的那個“建構式”，
通過建構式創建出來的物件，我們稱之為“實體物件”， 每個“實體物件”中都有一個默認的屬性，叫做__proto__， __proto__指向創建它的那個建構式的“原型物件”，**
效果：
三角戀圖：
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/213930.html
標籤：其他
上一篇：那些JS中常見的面試題及知識點