函式是Javascript的基礎語法之一,當然,也是最重要的,是我們必須要掌握好的知識點之一。
前幾個所記錄的執行上下文、作用域、變數物件、閉包、this等知識點,其實都是在圍繞函式在展開(知道這一點,個人覺得非常重要)。
之前的筆記可以說都是在進一步認識函式,而這次開始,則是認識函式之後,來使用函式了。
在之前的學習中,我們學習了那麼多函式的本質,是時候來做個總結了。
1、在實際開發中,需要用函式來做些什麼?
2、可以用函式的這些特性玩哪些東西?
3、要怎樣使用函式才能讓程式碼更加清晰、直觀與合理?
好吧,還是來讓我們進一步學習奇妙的函式吧。
12.1 函式
在實際開發中,經常能遇到的函式形式大概有四種,分別是函式宣告、函式表示式、匿名函式與函式自執行。
可能大家對這幾種常見的函式形式已不在陌生,但是我還是專門總結一下吧。
1、函式宣告
函式宣告是指利用function關鍵字來宣告一個函式。
function fn() {
console.log('hello');
}複製程式碼
在變數物件的建立過程中,function宣告的函式比var宣告的變數有更加優先的執行順序,即我們常常提到的變數提升。因此在同一執行上下文中,無論在什麼地方宣告瞭函式,都可以直接使用。
2、函式表示式
函式表示式其實是將一個函式體賦值給一個變數的過程。
var fn = function() {};複製程式碼
因此,我們理解的函式表示式只需把他當作變數宣告去理解
//建立階段
var fn = undefined;
//執行階段
fn = function() {}; 複製程式碼
如果你比較喜歡使用函式表示式,那麼一定要有一個良好的編碼習慣,以規避變數提升帶來的負面影響。
函式體賦值的操作在其它很多場景中都能夠遇到,如下:
function Person(name) {
this.name = name;
this.age = age;
//在建構函式內部新增方法
this.getAge = function() {
return this.age
}
}
//給原型上新增方法
Person.prototype.getName = function() {
return this.name;
}
//在物件中新增方法
var a = {
m: 20,
getM: function() {
return this.m
}
}複製程式碼
3、匿名函式
顧名思義,就是沒有名字的函式,一般會作為一個引數或者作為一個返回值來使用,通常不使用變數來儲存它的引用。常見場景如下:
(1)setTimeout中的引數
var timer = setTimeout(function() {
console.log('xxxxxx')
},1000);複製程式碼
(2)陣列方法中的引數
var arr = [1,2,3];
arr.map(function(item) {
return item + 1;
})
arr.forEach(function(item) {
//todo
})複製程式碼
(3)匿名函式作為一個返回值
function add() {
var a = 10;
return function() {
return a + 1;
}
};
add()();複製程式碼
4、自執行函式
自執行函式是匿名函式一個非常重要的應用場景。因為函式會產生獨立的作用域,因此我們常常利用自執行函式來模擬塊級作用域,並進一步在此基礎上實現模組化的運用。
(function() {
//....
})();複製程式碼
模組化的重要性,我們應該時刻提醒自己,並且在學習過程中,應慢慢養成對於模組化思維的一個認知和習慣。因此,雖然在上一個系列已經簡單說過模組化了,但這裡任然要藉助自執行函式來了解模組化。
一個模組可以包括:私有變數、私有方法、公有變數、公有方法。
當我們使用自執行函式建立一個模組時,也就意味著,外界已經無法訪問該模組內部的任何屬性和方法了。好在有閉包,作為模組之間能互相通訊的橋樑,讓模組能夠在我們的控制下選擇性地對外開放屬性與方法。
(function() {
//私有變數
var age = 18;
var name = 'pan';
//私有方法
function getName() {
return 'my name is ' + name;
}
//公有方法
function getAge() {
return age;
}
//將引用儲存在外部執行環境的變數中,這是一種簡單的對外開發方法的方式
window.getAge = getAge;
})();複製程式碼
這些都是我以往的學習筆記。如果您看到此筆記,希望您能指出我的錯誤。有這麼一個群,裡面的小夥伴互相監督,堅持每天輸出自己的學習心得,不輸出就出局。希望您能加入,我們一起終身學習。歡迎新增我的個人微訊號:Pan1005919589