斷言

創(chuàng)新互聯(lián)成立十多年來，這條路我們正越走越好，積累了技術(shù)與客戶資源，形成了良好的口碑。為客戶提供成都網(wǎng)站制作、做網(wǎng)站、外貿(mào)營銷網(wǎng)站建設(shè)、網(wǎng)站策劃、網(wǎng)頁設(shè)計(jì)、空間域名、網(wǎng)絡(luò)營銷、VI設(shè)計(jì)、網(wǎng)站改版、漏洞修補(bǔ)等服務(wù)。網(wǎng)站是否美觀、功能強(qiáng)大、用戶體驗(yàn)好、性價(jià)比高、打開快等等，這些對(duì)于網(wǎng)站建設(shè)都非常重要，創(chuàng)新互聯(lián)通過對(duì)建站技術(shù)性的掌握、對(duì)創(chuàng)意設(shè)計(jì)的研究為客戶提供一站式互聯(lián)網(wǎng)解決方案，攜手廣大客戶，共同發(fā)展進(jìn)步。

單元測(cè)試框架的核心是斷言方法，通常叫assert()。

該方法通常接收一個(gè)值--需要斷言的值，以及一個(gè)表示該斷言目的的描述。

如果該值執(zhí)行的結(jié)果為true，斷言就會(huì)通過；

否則，斷言就會(huì)被認(rèn)為是失敗的。

通常用一個(gè)相應(yīng)的通過（pass）/ 失?。╢ail）標(biāo)記記錄相關(guān)的信息；

function assert(value, desc) {
  let li = document.createElement('li');
  li.className = value ? 'pass' : 'fail';
  li.appendChild(document.createTextNode(desc));
  document.getElementById('results').appendChild(li);
}

// 斷言函數(shù)
function assert(value, desc) {
  if (value) {
    console.log(`\033[32m ${desc} \033[0m`);  // 斷言通過 綠色字體
  } else {
    console.log(`\033[31m ${desc} \033[0m`);  // 斷言失敗 紅色字體
  }
}

函數(shù)

• JavaScript是一門函數(shù)式語言
• 在JavaScript中，函數(shù)是第一型對(duì)象。函數(shù)可以共處，可以視作為其他任意類型的對(duì)象。就像普通的JavaScript數(shù)據(jù)類型，，函數(shù)可以被任意變量進(jìn)行引用，或聲明成對(duì)象字面量，甚至可以將其作為函數(shù)參數(shù)進(jìn)行傳遞。
• 函數(shù)是第一型對(duì)象
• 可以通過字面量進(jìn)行創(chuàng)建。
• 可以賦值給變量、數(shù)組或其他對(duì)象的屬性。
• 可以作為參數(shù)傳遞給函數(shù)。
• 可以作為函數(shù)的返回值進(jìn)行返回。
• 可以擁有動(dòng)態(tài)創(chuàng)建并賦值的屬性。
• 命名一個(gè)函數(shù)時(shí)，該名稱在整個(gè)函數(shù)聲明范圍內(nèi)是有效的。如果函數(shù)聲明在頂層，window對(duì)象上的同名屬性則會(huì)引用到該函數(shù)。
• 所有的函數(shù)都有一個(gè)name屬性，該屬性保存的是該函數(shù)名稱的字符串。匿名函數(shù)的name屬性值為空。
• 在JavaScript中，作用域是由function進(jìn)行聲明的，而不是代碼塊。聲明的作用域創(chuàng)建于代碼塊，但不是終結(jié)于代碼塊（其他語言是終結(jié)于代碼塊的）

if (window) {
  var x = 123;
}
alert(x);

執(zhí)行代碼后，會(huì)彈出123，是因?yàn)镴avaScript在大括號(hào)關(guān)閉處并沒有終止其作用域。

• 變量聲明的作用域開始于聲明的地方，結(jié)束于函數(shù)的結(jié)尾，與代碼嵌套無關(guān)。
• 命名函數(shù)的作用域是指聲明該函數(shù)的整個(gè)函數(shù)范圍，與代碼嵌套無關(guān)；
• 對(duì)于作用域聲明，全局上下文就像一個(gè)包含頁面所有代碼的超大型函數(shù)。
• 所有的函數(shù)調(diào)用都會(huì)傳遞兩個(gè)隱式參數(shù)：argument和this

作為函數(shù)進(jìn)行調(diào)用

如果一個(gè)數(shù)不是作為方法、構(gòu)造器、或者通過apply()或call()進(jìn)行調(diào)用的，則認(rèn)為它是“作為函數(shù)”進(jìn)行調(diào)用的。

function ninja() {};
ninja()

var samurai = function() {};
samurai()

• 以這種方式調(diào)用時(shí)，函數(shù)的上下文是全局上下文---window對(duì)象。

作為方法進(jìn)行調(diào)用

當(dāng)一個(gè)函數(shù)被賦值給對(duì)象的一個(gè)屬性，并使用引用該函數(shù)的這個(gè)屬性進(jìn)行調(diào)用時(shí)，那么函數(shù)就是作為該對(duì)象的一個(gè)方法進(jìn)行調(diào)用的。

var 0 = {};
o.whatever = function() {};
o.whatever();

• 將函數(shù)作為對(duì)象的一個(gè)方法進(jìn)行調(diào)用時(shí)，該對(duì)象就變成了函數(shù)上下文，并且在函數(shù)內(nèi)部可以以this參數(shù)的形式進(jìn)行訪問。

作為構(gòu)造器進(jìn)行調(diào)用

• 將函數(shù)作為構(gòu)造器進(jìn)行調(diào)用，需要在函數(shù)調(diào)用前使用new關(guān)鍵字
  

創(chuàng)建一個(gè)新的空對(duì)象；

傳遞給構(gòu)造器都對(duì)象是this參數(shù)，從而成為構(gòu)造器的函數(shù)上下文；

如果沒有顯式都返回值，新創(chuàng)建的對(duì)象則作為構(gòu)造器的返回值進(jìn)行返回。

function Ninja() {
  this.skulk = function() { return this; }
}

var ninja1 = new Ninja();
var ninja2 = new Ninja();

構(gòu)造器的目的是通過函數(shù)調(diào)用初始化創(chuàng)建新的對(duì)象。

函數(shù)調(diào)用方式差異

• 函數(shù)調(diào)用方式之間點(diǎn)主要差異是：作為this參數(shù)傳遞給執(zhí)行函數(shù)的上下文對(duì)象之間點(diǎn)區(qū)別。
  

作為方法調(diào)用，該上下文是方法的擁有者；
作為全局函數(shù)進(jìn)行調(diào)用，其上下文永遠(yuǎn)是window（也就說，該函數(shù)是window的一個(gè)方法）。
作為構(gòu)造器進(jìn)行調(diào)用，其上下文對(duì)象則是新創(chuàng)建的對(duì)象實(shí)例。

使用apply()和call()方法

• 通過函數(shù)的apply()方法來調(diào)用函數(shù)，需要給apply()傳入兩個(gè)參數(shù)：一個(gè)是函數(shù)上下文的對(duì)象，另一個(gè)是作為函數(shù)參數(shù)所組成的數(shù)組；
• 通過函數(shù)的call()方法來調(diào)用函數(shù)，需要給call()傳入兩個(gè)參數(shù)：一個(gè)是函數(shù)上下文的對(duì)象，另一個(gè)是作為函數(shù)參數(shù)的參數(shù)列表，而不是單個(gè)數(shù)組；

function juggle() {
  var result = 0;
  for (var n = 0; n < arguments.length; n++) {
    result += arguments[n]
  }
  this.result = result;
}
var ninja1 = {};
var ninja2 = {};

juggle.apply(ninja1, [1,2,3,4]);
juggle.call(ninja2, 5,6,7,8)

assert(ninja1.result === 10, 'juggled via apply');
assert(ninja2.result === 26, 'juggled via call');

使用apply()和call()可以選擇任意對(duì)象作為函數(shù)上下文；

函數(shù)總結(jié)

函數(shù)是第一型對(duì)象；

• 通過字面量進(jìn)行創(chuàng)建。
• 賦值給變量或?qū)傩浴?/li>
• 作為參數(shù)進(jìn)行傳遞。
• 作為函數(shù)結(jié)果進(jìn)行返回。
• 擁有屬性和方法。

函數(shù)是通過字面量進(jìn)行創(chuàng)建的，其名稱是可選的。

在頁面生命周期內(nèi)，瀏覽器可以將函數(shù)作為各種類型的事件處理程序進(jìn)行調(diào)用。

變量的作用域開始于聲明處，結(jié)束于函數(shù)尾部，其會(huì)跨域邊界（如：大括號(hào)）

內(nèi)部函數(shù)在當(dāng)前函數(shù)的任何地方都可用（提升），即便是提前引用。

函數(shù)的形參列表和實(shí)際參數(shù)列表的長度可以是不同的。

• 未賦值的參數(shù)被設(shè)置為undefined。
• 多出的參數(shù)是不會(huì)綁定到參數(shù)名稱的。

每個(gè)函數(shù)調(diào)用都會(huì)傳入兩個(gè)隱式參數(shù)。

• arguments，實(shí)際傳入的參數(shù)集合。
• this，作為函數(shù)上下文的對(duì)象引用。

可以用不同的方法進(jìn)行函數(shù)調(diào)用，不同的調(diào)用機(jī)制決定了函數(shù)上下文的不同。

• 作為普通函數(shù)進(jìn)行調(diào)用時(shí)，其上下文是全局對(duì)象（window）。
• 作為方法進(jìn)行調(diào)用時(shí)，其上下文是擁有該方法的對(duì)象。
• 作為構(gòu)造器進(jìn)行調(diào)用時(shí)，其上下文是新分配的對(duì)象實(shí)例。
• 通過函數(shù)的apply()或call()方法進(jìn)行調(diào)用時(shí)，上下文可以設(shè)置成任意值。

匿名函數(shù)

為了不讓不必要的函數(shù)名稱污染全局命名空間，可以創(chuàng)建大量的小型函數(shù)進(jìn)行傳遞，而不是創(chuàng)建包含大量命令語句的大型函數(shù)。

遞歸

• 遞歸：當(dāng)函數(shù)調(diào)用自身，或調(diào)用另外一個(gè)函數(shù)，但這個(gè)函數(shù)的調(diào)用樹中的某個(gè)地方又調(diào)用到了自己時(shí)，就產(chǎn)生了遞歸。
• 遞歸的兩個(gè)條件：引用自身，并且有終止條件。

閉包

• 閉包是一個(gè)函數(shù)在創(chuàng)建時(shí)允許自身函數(shù)訪問并操作該自身函數(shù)之外的變量時(shí)所創(chuàng)建的作用域
• 閉包可以讓函數(shù)訪問所有的變量和函數(shù)，只要這些變量和函數(shù)存在于該函數(shù)聲明時(shí)的作用域內(nèi)就行。

var outerValue = 'ninja';

var later;


function outerFunction() {

  // 該變量的作用域限制在該函數(shù)內(nèi)部，并且在函數(shù)外部訪問不到；
  var innerValue = 'samurai';

  // 在外部函數(shù)內(nèi)，聲明一個(gè)內(nèi)部函數(shù)。
  // 注意：聲明該函數(shù)時(shí)，innerValue是在作用域內(nèi)的
  function innerFunction() {
    assert(outerValue, 'I can see the ninja');
    assert(innerValue, 'I can see the samurai');

    // 將內(nèi)部函數(shù)引用到later變量上，由于later在全局作用域內(nèi)，所以可以對(duì)它進(jìn)行調(diào)用。
    later = innerFunction;
  }
}

// 調(diào)用外部函數(shù)，將會(huì)聲明內(nèi)部函數(shù)，并將內(nèi)部函數(shù)賦值給later變量。
outerFunction();

// 通過later調(diào)用內(nèi)部函數(shù)。
// 我們不能直接調(diào)用內(nèi)部函數(shù)，因?yàn)樗淖饔糜颍ê蚷nnerValue一起）被限制在outerFunction內(nèi)。
later();

閉包使用場(chǎng)景：私有變量

在構(gòu)造器內(nèi)隱藏變量，使其在外部作用域不可訪問，但是可以存在于閉包內(nèi)。

function Ninja() {
  var feints = 0;

  this.getFenits = function() {
    return feints;
  }

  this.feint = function() {
    feints++;
  }
}

var ninja = new Ninja();

ninja.feint();

assert(ninja.getFenits() === 1, '調(diào)用一次，內(nèi)部變量++');

assert(ninja.feints === undefined, '函數(shù)外部不可訪問')

變量的作用域依賴于變量所在的閉包

閉包記住的是變量的引用，而不是閉包創(chuàng)建時(shí)刻該變量的值

原型與面向?qū)ο?/strong>

• 所有的函數(shù)在初始化時(shí)都有一個(gè)prototype屬性，該屬性的初始值是一個(gè)空對(duì)象。
• 使用new操作符將函數(shù)作為構(gòu)造器進(jìn)行調(diào)用的時(shí)候，其上下文被定義為新對(duì)象的實(shí)例。
• 在構(gòu)造器內(nèi)的綁定操作優(yōu)先級(jí)永遠(yuǎn)高于在原型上的綁定操作優(yōu)先級(jí)。因?yàn)闃?gòu)造器的this上下文指向的是實(shí)例自身，所以我們可以在構(gòu)造器內(nèi)對(duì)核心內(nèi)容執(zhí)行初始化操作。
• 通過instanceof操作，可以判斷函數(shù)是否繼承了其原型鏈中任何對(duì)象的功能。