從零開始學 Web 之 JavaScript（三）函數

你們好，這裏是「 Daotin的夢囈 」從零開始學 Web 系列教程。此文首發於「 Daotin的夢囈 」公衆號，歡迎你們訂閱關注。在這裏我會從 Web 前端零基礎開始，一步步學習 Web 相關的知識點，期間也會分享一些好玩的項目。如今就讓咱們一塊兒進入 Web 前端學習的冒險之旅吧！

1、函數

一、函數的定義

// 第一種
function fn1(){
    console.log("我是第一種定義方法！");
}

// 第二種
var fn2 = function (){
    console.log("我是第二種定義方法！");
};  // 注意分號

function (){
 　　console.log("我是第二種定義方法！");
}();  // 第二種方式的調用方式之一：函數的自調用

//第三種
var fn3 = new Function("console.log('我是第三種定義方法！')");

第一種：（函數的聲明）第一種定義方法最強大，定義完畢後，在哪裏使用均可以，無位置限制。 第二種：(函數表達式：匿名函數) 後兩種定義方法是有侷限性的。（使用函數必須在定義函數以後）

二、函數的調用

函數名();

三、函數名

• 要遵循駝峯命名法。
• 不能同名（函數重載），不然後面的函數會覆蓋前面的函數。

//打印函數名，就等於打印整個函數。
console.log(fn);
//打印執行函數，就等於打印函數的返回值。
console.log(fn());

四、形參和實參

• 形參不須要寫 var.
• 形參的個數和實參的個數能夠不一致 。

五、返回值

1. 若是函數沒有顯示的使用 return 語句 ，那麼函數有默認的返回值：undefined
2. 若是函數使用 return 語句，可是 return 後面沒有任何值，那麼函數的返回值也是：undefined.

六、變量和做用域

全局變量：在 script 使用 var 定義的變量（全部的 script 共享其全局性，js 裏面沒有塊級做用域概念，只有全局做用域和局部做用域）。

隱式全局變量：在 script 沒有 var 的變量。

function fn（）{
　　var a = b = c = 1;　　     // b和c就是隱式全局變量（等號）
　　var a = 1; b = 2; c = 3;   // b和c就是隱式全局變量（分號）
　　var a = 1 , b = 2 , c = 3;  // b和c就不是隱式全局變量（逗號）
}

（全局變量是不能被刪除的，隱式全局變量是能夠被刪除的）

var num1 = 10;
num = 20;
delete num1;
delete num2;
console.log(typeof num1); // number
console.log(typeof num2); // undefined

局部變量：函數內部用 var 定義的變量和形參。

6.一、變量聲明提高（預解析）

**做用：**查看語法錯誤。js的解析器在頁面加載的時候，首先檢查頁面上的語法錯誤。把變量聲明提高起來。（變量聲明提高和函數總體提高）

6.二、變量的提高

只提高變量名，不提高變量值。

consolas.log(aaa);// 打印的結果是 undefined ，由於只提高變量名，不提高變量值。
var aaa = 111;

在函數範圍內，照樣適用。

6.三、函數的提高

function 直接定義的方法：總體提高（上面說的第一種函數定義的方法）.

fn();

var aaa = 111;
function fn(){
    //變量聲明提高在函數內部照樣實用。
    //函數的就近原則（局部變量做用域），打印的aaa不是111，而是 undefined。
    console.log(aaa); // undefined
    var aaa = 222;
}

預解析會分塊：

多對的 script 標籤中函數重名的話，預解析不會衝突。也就是預解析的做用域是每個的 script 標籤。

var先提高，function再提高：

示例：

console.log(a); // 輸出a函數體
function a() {
    console.log("aaaaa");
}
var a = 1;
console.log(a); // 輸出1

打印第一個結果的時候，var會提高，以後 function 再提高，可是函數a和變量a重名，function的a在後面覆蓋掉變量a，因此第一個輸出 a 函數體.

第二個前面var a = 1;提高以後，這個位置就至關於只有 a = 1; 賦值，因此第二個打印1.

6.四、匿名函數

做用大體以下：

//1.直接調用
(function (){
    console.log(1);
})();

//2.綁定事件
document.onclick = function () {
    alert(1);
}

//3.定時器
setInterval(function () {
    console.log(444);
},1000);