摘要:方法在中定義的函數(shù)。這種聲明方式會定義一個生成器函數(shù),它返回一個對象。類用定義的類,實際上也是函數(shù)。調(diào)用函數(shù)時使用的引用,決定了函數(shù)執(zhí)行時刻的值。表示當為時,取全局對象,對應了普通函數(shù)。四操作的內(nèi)置函數(shù)和可以指定函數(shù)調(diào)用時傳入的值。
筆記說明
重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構(gòu)你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權(quán)請聯(lián)系我,郵箱:[email protected]。一、函數(shù) 1.1、普通函數(shù)
用 function 關(guān)鍵字定義的函數(shù)。
function kaimo(){ // code }1.2、箭頭函數(shù)
用 => 運算符定義的函數(shù)。
const kaimo = () => { // code }1.3、方法
在 class 中定義的函數(shù)。
class KK { kaimo(){ //code } }1.4、生成器函數(shù)
用 function* 定義的函數(shù)。這種聲明方式會定義一個生成器函數(shù) (generator function),它返回一個 Generator 對象。
function* kaimo(){ // code }1.5、類
用 class 定義的類,實際上也是函數(shù)。
class KK { constructor(){ //code } }1.6、異步函數(shù)
普通函數(shù)、箭頭函數(shù)和生成器函數(shù)加上 async 關(guān)鍵字。
async function kaimo(){ // code } const kaimo = async () => { // code } async function kaimo*(){ // code }二、this關(guān)鍵字
this 是執(zhí)行上下文中很重要的一個組成部分。同一個函數(shù)調(diào)用方式不同,得到的 this 值也不2.1、普通函數(shù)情況下
function showThis(){ console.log(this); } var o = { showThis: showThis } showThis(); // global o.showThis(); // o
普通函數(shù)的 this 值由調(diào)用它所使用的引用決定。獲取函數(shù)的表達式,返回的是一個 Reference 類型。Reference 類型由兩部分組成:一個對象和一個屬性值。
上面代碼里 o.showThis 產(chǎn)生的 Reference 類型,即由對象 o 和屬性showThis構(gòu)成。
調(diào)用函數(shù)時使用的引用,決定了函數(shù)執(zhí)行時刻的 this 值。
2.2、箭頭函數(shù)情況下const showThis = () => { console.log(this); } var o = { showThis: showThis } showThis(); // global o.showThis(); // global
改為箭頭函數(shù)后,不論用什么引用來調(diào)用它,都不影響它的 this 值。
2.3、方法情況下// 這一個沒怎么弄明白,mark一下 class C { showThis() { console.log(this); } } var o = new C(); var showThis = o.showThis; showThis(); // undefined o.showThis(); // o
首先創(chuàng)建了一個類 C,并且實例化出對象 o,再把 o 的方法賦值給了變量 showThis。
三、this 關(guān)鍵字的機制1、在 JavaScript 標準中,為函數(shù)規(guī)定了用來保存定義時上下文的私有屬性 [[Environment]]。
2、當一個函數(shù)執(zhí)行時,會創(chuàng)建一條新的執(zhí)行環(huán)境記錄,記錄的外層詞法環(huán)境(outer lexical environment)會被設(shè)置成函數(shù)的 [[Environment]]。
/* 執(zhí)行上下文的切換機制 */ var a = 1; foo(); // 在別處定義了 foo: var b = 2; function foo(){ console.log(b); // 2 console.log(a); // error }
foo 能夠訪問 b(定義時詞法環(huán)境),卻不能訪問 a(執(zhí)行時的詞法環(huán)境)
3、JavaScript 用一個 棧 來管理執(zhí)行上下文,這個棧中的每一項又包含一個鏈表。
當函數(shù)調(diào)用時,會入棧一個新的執(zhí)行上下文,函數(shù)調(diào)用結(jié)束時,執(zhí)行上下文被出棧。
4、[[thisMode]] 私有屬性。
lexical:表示從上下文中找 this,這對應了箭頭函數(shù)。
global:表示當 this 為 undefined 時,取全局對象,對應了普通函數(shù)。
strict:當嚴格模式時使用,this 嚴格按照調(diào)用時傳入的值,可能為 null 或者 undefined。
"use strict" function showThis(){ console.log(this); } var o = { showThis: showThis } showThis(); // undefined o.showThis(); // o四、操作 this 的內(nèi)置函數(shù)
Function.prototype.call 和 Function.prototype.apply 可以指定函數(shù)調(diào)用時傳入的 this 值。
function foo(a, b, c){ console.log(this); console.log(a, b, c); } //call 和 apply 作用一樣,只是傳參方式有區(qū)別 foo.call({}, 1, 2, 3); // {} 1 2 3 foo.apply({}, [1, 2, 3]); // {} 1 2 3
Function.prototype.bind 它可以生成一個綁定過的函數(shù),這個函數(shù)的 this 值固定了參數(shù)
function foo(a, b, c){ console.log(this); console.log(a, b, c); } foo.bind({}, 1, 2, 3)(); // {} 1 2 3個人總結(jié)
腦殼都繞暈了_(:3」∠)_,里面還是有很多不懂的,繼續(xù)努力。。。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/53905.html
摘要:方法在中定義的函數(shù)。這種聲明方式會定義一個生成器函數(shù),它返回一個對象。類用定義的類,實際上也是函數(shù)。調(diào)用函數(shù)時使用的引用,決定了函數(shù)執(zhí)行時刻的值。表示當為時,取全局對象,對應了普通函數(shù)。四操作的內(nèi)置函數(shù)和可以指定函數(shù)調(diào)用時傳入的值。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構(gòu)你的前端知識體系,筆者主要整理學習過程的一些要...
摘要:方法在中定義的函數(shù)。這種聲明方式會定義一個生成器函數(shù),它返回一個對象。類用定義的類,實際上也是函數(shù)。調(diào)用函數(shù)時使用的引用,決定了函數(shù)執(zhí)行時刻的值。表示當為時,取全局對象,對應了普通函數(shù)。四操作的內(nèi)置函數(shù)和可以指定函數(shù)調(diào)用時傳入的值。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構(gòu)你的前端知識體系,筆者主要整理學習過程的一些要...
摘要:一自動插入分號規(guī)則三條規(guī)則要有換行符,且下一個符號是不符合語法的,那么就嘗試插入分號。有換行符,且語法中規(guī)定此處不能有換行符,那么就自動插入分號。源代碼結(jié)束處,不能形成完整的腳本或者模塊結(jié)構(gòu),那么就自動插入分號。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構(gòu)你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整...
閱讀 3751·2021-11-24 09:39
閱讀 3499·2019-08-30 15:56
閱讀 1384·2019-08-30 15:55
閱讀 1048·2019-08-30 15:53
閱讀 1937·2019-08-29 18:37
閱讀 3618·2019-08-29 18:32
閱讀 3148·2019-08-29 16:30
閱讀 2958·2019-08-29 15:14