js物件4 js原型 雜誌

2022-07-26 05:18:11 字數 2248 閱讀 5522

提問:在js中什麼是原型 prototype

每個學js的人都有自己的解釋,網上一大堆的解釋與應用,但是看了他們的解釋表示還是不理解怎麼辦?(原因是他們說的太天花亂墜了)

官方手冊解釋:prototype 屬性使您有能力向物件新增屬性和方法。

1.prototype是物件的乙個屬性

2.使用它可以給物件新增方法

小龍哥來解釋:解釋前還是來看乙個非常簡單的案例

先來討論一下css(做前端的都會這個--簡單吧)

當我們給元素新增樣式的時候經常的方式是不是

1.使用 class   (改變一類元素的樣式)

2.使用行間樣式    (給單個元素改變樣式)  (給單個物件新增方法)   

.box1 

<

div>

<

div

style

='background:

red' class

='box1'

>

div>

<

div

class

='box2'

>

div>

<

div

class

='box2'

>

div>

<

div

class

='box2'

>

div>

<

div

class

='box2'

>

div>

div>

還記得上一章中的這個案例  只能給單個的陣列物件求和(類似於css行間樣式)

1

var arr1 = new array(22,44,1,6,7); //

也可以使用直接量建立 var arr1 = [22,44,1,6,7];

2 arr1.sum = function()

8return

result;9}

10 alert(arr1.sum()); //

80

給array類的原型上新增乙個方法.你有多少個陣列都可以給這些陣列求和  類似於css中的class

var arr1 = new array(22,44,1,6,7);   //

也可以使用直接量建立 var arr1 = [22,44,1,6,7];

var arr2 = new array(1,24,5,6

); array.prototype.sum = function()

return

result;

}alert(arr1.sum());

//80

alert(arr2.sum()); //

36alert(arr1.sum == arr2.sum ) //true 因為他們都是來自同乙個原型上的方法 解決浪費

簡單的總結:給乙個類的原型上新增乙個方法,那麼通過這個類建立出來的物件都可以使用這個方法

1.使用 class   (改變一類元素的樣式)     (類似於:在類的原型上新增方法

2.使用行間樣式    (給單個元素改變樣式)  (給單個物件新增方法) 

現在可以給前面的例項填上原型

總結:1.建構函式名首字母大寫

2.在建構函式裡面新增屬性(不相同的新增到建構函式裡面)

3.在建構函式的原型prototype上新增方法  (相同的新增到原型上)

4.以後要是想不起來原型是幹嘛的,就想想css吧

討論原型與單個物件的優先順序

array.prototype.a = 12 //原型上新增類似於class

var arr1 = [1,33,4,77];

alert(arr1.a) //12

arr1.a = 5;

alert(arr1.a) //5 //單個物件上新增 類似於行間樣式

在css中行間樣式的優先順序大於class的優先順序

便簽4 js陣列

1.php中的陣列宣告是 a array 0 高某 1 男 或者是 a array 姓名 高某 性別 男 2.js中陣列的建立方法 1 使用new關鍵字和array 來建立陣列 var arr new array 建立乙個空陣列 var arr new array 周更生 男 30 建立乙個陣列,並...

4 js內建函式

前言 全域性函式 陸續補充中 number 函式 把物件的值轉換為數字。如果物件的值無法轉換為數字,那麼 number 函式返回 nan。var test1 new boolean true 布林物件 var test2 new date 日期物件 var test3 new string 999 ...

JS 物件 JS原型 原型鏈

參考學習 js物件 構造器函式 建立物件的函式。物件分為普通物件和函式物件。所有物件都有 proto 屬性 函式物件不止有 proto 屬性,還有prototype屬性 稱為原型物件 1.new function 產生的物件都是函式物件。2.所有函式物件的 proto 都指向function.pro...