JS中的實例方法、靜態方法、實例屬性、靜態屬性

1、靜態方法與實例方法的例子:html

咱們先來看一個例子來看一下JS中的靜態方法和實例方法究竟是什麼?promise

靜態方法:函數

function A(){}post

A.col='red'  //靜態屬性ui

A.sayMeS=function(){this

console.log("Hello World S!");.net

}prototype

A.sayMeS();//輸出Hello World S!指針

 

實例方法: htm

function A(){

    this.Color="yellow"  //實例屬性

}

A.prototype.age=14;  //實例屬性

A.prototype.sayMeE=function(){

console.log("Hello World E!");

}

var a=new A();

a.sayMeE();//輸出Hello World E!

注意:咱們還有一種寫法,以下:

A.prototype = new Animal();

或者

A.prototype = {
    aa:32323,
    say: function() { console.log("My color is " + this.color); }
}

這個寫法,會覆蓋前面的A.prototype.age  和  A.prototype.sayMeE ,因此必定要注意順序,把這個兩種寫法放到前面,而後再寫本身定義的

 

2、兩者的區別:

從定義上,實例方法要用到function這個對象中的prototype屬性來定義,靜態方法經過A.直接定義;從方法調用上,靜態方法能夠直接經過A.來調用,實例方法要經過先定義一個引用變量,指向構造函數定義的新對象。

咱們以前的博文已經討論過JS對象、構造函數、原型(參看Js中的對象、構造函數、原型、原型鏈及繼承),這裏加深一下理解,咱們以前已經說過函數是一個對象,函數對象中的屬性 prototype能夠想成一個指針,指向一個方法(這樣不用每一次用構造函數創造一個新實例後都要將方法從新建立一遍)。這樣就好理解了,var a是A的一個引用,也就是指針,a就能夠指向sayMeE這個方法,若是直接A.sayMeE()是會報錯的,由於A不是一個指針,a.sayMeS()也會報錯,由於a不是一個方法對象。

3、再談繼承:

繼承舉例:

function A(){ }

A.prototype.sayMeE=function(){
    console.log("Hello World E!");
}

function B(){ }

B.prototype=new A();//實現了繼承

繼承就是將B的指針指向A對象,這種形式是用A的構造函數來構建對象。

 

出處:https://www.cnblogs.com/hanguidong/p/9296697.html

====================================================================

背景
以前一直覺得構造函數能夠直接訪問原型方法,是錯的,如今說一下

實例方法
構造函數中this上添加的成員 ,在Cat構造方法裏面,定義在this中的變量和方法,只有實例才能訪問到:如this.name,this.move,this.eat這些都是實例擁有,沒法經過Cat直接調用。

function Cat(name){
this.name = name
this.move = function() {
console.log('移動')
}
this.eat = function() {
console.log(`${this.name}愛吃魚`)
}
}
//給Cat構造函數添加靜態方法
Cat.eat = function() {console.log(`${this.name}愛吃魚`)}
let cat = new Cat('tom')
Cat.eat() //Cat愛吃魚 //這是靜態方法
Cat.move() //Cat.move is not a function
cat.eat() //tom愛吃魚 //這是實例方法
cat.move() //移動 //這是實例方法

靜態方法
構造函數自己上添加的成員 

下面的Cat.eat就是構造函數的靜態方法,不能經過實例調用

function Cat(name){
this.move = function() {
console.log(1)
}
}
//直接定義在Cat構造函數中,實例不能調用
Cat.eat = function() {console.log(`${this.name}愛吃魚`)}
構造函數調用
Cat.eat() //Cat愛吃魚
Cat.move() //Cat.move is not a function
let cat = new Cat()
cat.eat() //cat.eat is not a function
原型方法
原型中的方法實例和構造函數均可以訪問到

function Cat() {
}
Cat.eat = function() {
console.log('靜態方法')
}
Cat.prototype.eat = function() {
console.log('原型方法')
}
let cat = new Cat()
Cat.eat() //靜態方法
Cat.prototype.eat() //原型方法,不用prototype就是打印靜態方法

cat.eat() //原型方法
結論
簡而言之,實例方法就是隻有實例能夠調用,靜態方法只有構造函數能夠調用,原型方法是實例和構造函數均可以調用,是共享的方法。

像Promise.all和Promise.race這些就是靜態方法,Promise.prototype.then這些就是原型方法,new 出來的實例能夠調用

let promise = new Promise(function(resolve, rejected) {
resolve()
}) 
promise.then() //then是原型方法

 

出處:http://www.javashuo.com/article/p-rjvqwjro-dm.html

參考:http://www.javashuo.com/article/p-eckdxmyj-w.html

相關文章
相關標籤/搜索