摘要:函數(shù)表達(dá)式又名匿名函數(shù)為變量賦的值是函數(shù)定義本身。在語(yǔ)言里任何匿名函數(shù)都是屬于對(duì)象。這種情況下,就叫做回調(diào)函數(shù)。如上面代碼示例展示了文檔單擊事件時(shí)以冒泡模式傳遞給回調(diào)函數(shù)的特別適用于事件驅(qū)動(dòng)編程,因?yàn)榛卣{(diào)模式支持程序以異步方式運(yùn)行。
JavaScript設(shè)計(jì)模式的作用是提高代碼的重用性,可讀性,使代碼更容易的維護(hù)和擴(kuò)展
在javascript中,函數(shù)是一類對(duì)象,這表示他可以作為參數(shù)傳遞給其他函數(shù);此外,函數(shù)還可以提供作用域。
js函數(shù)基礎(chǔ)部分:JavaScript學(xué)習(xí)總結(jié)(四)function函數(shù)部分
創(chuàng)建函數(shù)的語(yǔ)法 命名函數(shù)表達(dá)式//命名函數(shù)表達(dá)式 var add = function add(a,b){ return a+b; }; var foo = function bar() { console.log(foo === bar); }; foo();//true
可見(jiàn),他們引用的是同一函數(shù),但這只在函數(shù)體內(nèi)有效。
var foo = function bar() {}; console.log(foo === bar);//ReferenceError: bar is not defined
但是,你不能通過(guò)調(diào)用bar()來(lái)調(diào)用該函數(shù)。
var foo = (function bar() { console.log(foo === bar); })();//false函數(shù)表達(dá)式
//又名匿名函數(shù) var add = function(a,b){ return a+b; };
為變量 add 賦的值是函數(shù)定義本身。這樣,add 就成了一個(gè)函數(shù),可以在任何地方調(diào)用。
函數(shù)的聲明function foo(){ //code here } //這里可以不需要分號(hào)
在尾隨的分號(hào)中,函數(shù)表達(dá)式應(yīng)總是使用分號(hào),而函數(shù)的聲明中并不需要分號(hào)結(jié)尾。
聲明式函數(shù)與函數(shù)表達(dá)式的區(qū)別在于:在JS的預(yù)編譯期,聲明式函數(shù)將會(huì)先被提取出來(lái),然后才按順序執(zhí)行js代碼:
console.log(f1);//[Function: f1] console.log(f2);//undefined,Javascript并非完全的按順序解釋執(zhí)行,而是在解釋之前會(huì)對(duì)Javascript進(jìn)行一次“預(yù)編譯”,在預(yù)編譯的過(guò)程中,會(huì)把定義式的函數(shù)優(yōu)先執(zhí)行 function f1(){ console.log("I am f1"); } var f2 = function (){ console.log("I am f2"); };
由于聲明函數(shù)都會(huì)在全局作用域構(gòu)造時(shí)候完成,因此聲明函數(shù)都是window對(duì)象的屬性,這就說(shuō)明為什么我們不管在哪里聲明函數(shù),聲明函數(shù)最終都是屬于window對(duì)象的原因了。
在javascript語(yǔ)言里任何匿名函數(shù)都是屬于window對(duì)象。在定義匿名函數(shù)時(shí)候它會(huì)返回自己的內(nèi)存地址,如果此時(shí)有個(gè)變量接收了這個(gè)內(nèi)存地址,那么匿名函數(shù)就能在程序里被使用了,因?yàn)槟涿瘮?shù)也是在全局執(zhí)行環(huán)境構(gòu)造時(shí)候定義和賦值,所以匿名函數(shù)的this指向也是window對(duì)象
var f2 = function (){ console.log("I am f2"); }; console.log(f2());//I am f2 (function(){ console.log(this === window);//true })();函數(shù)聲明與表達(dá)式 函數(shù)的提升(hoisting)
函數(shù)聲明的行為并不等同于命名函數(shù)表達(dá)式,其區(qū)別在于提升(hoisting)行為,看下面例子:
對(duì)于所有變量,無(wú)論在函數(shù)體的何處進(jìn)行聲明,都會(huì)在內(nèi)部被提升到函數(shù)頂部。而對(duì)于函數(shù)通用適用,其原因在于函數(shù)只是分配給變量的對(duì)象。
提升,顧名思義,就是把下面的東西提到上面。在JS中,就是把定義在后面的東西(變量或函數(shù))提升到前面中定義。 從上面的例子可以看出,在函數(shù)hoist內(nèi)部中的foo和bar移動(dòng)到了頂部,從而覆蓋了全局foo和bar函數(shù)。局部函數(shù)bar和foo的區(qū)別在于,foo被提升到了頂部且能正常運(yùn)行,而bar()的定義并沒(méi)有得到提升,僅有它的聲明被提升,所以,當(dāng)執(zhí)行bar()的時(shí)候顯示結(jié)果為undefined而不是作為函數(shù)來(lái)使用。
即時(shí)函數(shù)模式函數(shù)也是對(duì)象,因此它們可以作為返回值。使用自執(zhí)行函數(shù)的好處是直接聲明一個(gè)匿名函數(shù),立即使用,省得定義一個(gè)用一次就不用的函數(shù),而且免了命名沖突的問(wèn)題,js中沒(méi)有命名空間的概念,因此很容易發(fā)生函數(shù)名字沖突,一旦命名沖突以最后聲明的為準(zhǔn)。
模式一:模式二:自執(zhí)行函數(shù)變量的指向
模式三:嵌套函數(shù)
模式四:自執(zhí)行函數(shù)把它的返回值賦給變量
var abc = (function () { var a = 1; return function () { return ++a; } })();//自執(zhí)行函數(shù)把return后面的函數(shù)返回給變量 alert(abc());//如果是alert(abc)就會(huì)彈出return語(yǔ)句后面的代碼;如果是abc(),則會(huì)執(zhí)行return后面的函數(shù)模式五:函數(shù)內(nèi)部執(zhí)行自身,遞歸
// 這是一個(gè)自執(zhí)行的函數(shù),函數(shù)內(nèi)部執(zhí)行自身,遞歸 function abc() { abc(); }回調(diào)模式
回調(diào)函數(shù):當(dāng)你將一個(gè)函數(shù)write()作為一個(gè)參數(shù)傳遞給另一個(gè)函數(shù)call()時(shí),那么在某一時(shí)刻call()可能會(huì)執(zhí)行(或者調(diào)用)write()。這種情況下,write()就叫做回調(diào)函數(shù)(callback function)。
異步事件監(jiān)聽(tīng)器回調(diào)模式有許多用途,比如,當(dāng)附加一個(gè)事件監(jiān)聽(tīng)器到頁(yè)面上的一個(gè)元素時(shí),實(shí)際上是提供了一個(gè)回調(diào)函數(shù)的指針,該函數(shù)將會(huì)在事件發(fā)生時(shí)被調(diào)用。如:
document.addEventListener("click",console.log,false);
上面代碼示例展示了文檔單擊事件時(shí)以冒泡模式傳遞給回調(diào)函數(shù)console.log()的
javascript特別適用于事件驅(qū)動(dòng)編程,因?yàn)榛卣{(diào)模式支持程序以異步方式運(yùn)行。
超時(shí)使用回調(diào)模式的另一個(gè)例子是,當(dāng)使用瀏覽器的window對(duì)象所提供的超時(shí)方法:setTimeout()和setInterval(),如:
庫(kù)中的回調(diào)模式
當(dāng)設(shè)計(jì)一個(gè)js庫(kù)時(shí),回調(diào)函數(shù)將派上用場(chǎng),一個(gè)庫(kù)的代碼應(yīng)盡可能地使用可復(fù)用的代碼,而回調(diào)可以幫助實(shí)現(xiàn)這種通用化。當(dāng)我們?cè)O(shè)計(jì)一個(gè)龐大的js庫(kù)時(shí),事實(shí)上,用戶并不會(huì)需要其中的大部分功能,而我們可以專注于核心功能并提供“掛鉤形式”的回調(diào)函數(shù),這將使我們更容易地構(gòu)建、擴(kuò)展,以及自定義庫(kù)方法
Curry化Curry化技術(shù)是一種通過(guò)把多個(gè)參數(shù)填充到函數(shù)體中,實(shí)現(xiàn)將函數(shù)轉(zhuǎn)換為一個(gè)新的經(jīng)過(guò)簡(jiǎn)化的(使之接受的參數(shù)更少)函數(shù)的技術(shù)?!揪↗avaScript】
簡(jiǎn)單來(lái)說(shuō),Curry化就是一個(gè)轉(zhuǎn)換過(guò)程,即我們執(zhí)行函數(shù)轉(zhuǎn)換的過(guò)程。如下例子:
當(dāng)?shù)谝淮握{(diào)用add()時(shí),它為返回的內(nèi)部函數(shù)創(chuàng)建了一個(gè)閉包。該閉包將原始的x和y值存儲(chǔ)到私有變量oldx和oldy中。
現(xiàn)在,我們將可使用任意函數(shù)curry的通用方法,如:
何時(shí)使用Curry化
當(dāng)發(fā)現(xiàn)正在調(diào)用同一個(gè)函數(shù)時(shí),并且傳遞的參數(shù)絕大多數(shù)都是相同的,那么該函數(shù)可能是用于Curry化的一個(gè)很好的候選參數(shù)
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://www.ezyhdfw.cn/yun/85358.html
摘要:個(gè)人前端文章整理從最開(kāi)始萌生寫文章的想法,到著手開(kāi)始寫,再到現(xiàn)在已經(jīng)一年的時(shí)間了,由于工作比較忙,更新緩慢,后面還是會(huì)繼更新,現(xiàn)將已經(jīng)寫好的文章整理一個(gè)目錄,方便更多的小伙伴去學(xué)習(xí)。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個(gè)人前端文章整理 從最開(kāi)始萌生寫文章的想法,到著手...
摘要:定義在中,定義一個(gè)正則表達(dá)式有兩種方式,一種是直接量,另一種是使用構(gòu)造函數(shù)。元字符在正則表達(dá)式的模式中,有一些字符是有特殊含義的,被稱為元字符,如果要匹配元字符,則必須對(duì)其進(jìn)行轉(zhuǎn)義。正則表達(dá)式詳解二 簡(jiǎn)介 先來(lái)一段介紹: 正則表達(dá)式,又稱正規(guī)表示法、常規(guī)表示法(英語(yǔ):Regular Expression,在代碼中常簡(jiǎn)寫為regex、regexp或RE),計(jì)算機(jī)科學(xué)的一個(gè)概念。...
摘要:看下面一個(gè)例子優(yōu)點(diǎn)使用構(gòu)造器函數(shù)的好處在于,它可以在創(chuàng)建對(duì)象時(shí)接收一些參數(shù)。按照慣例,構(gòu)造函數(shù)的函數(shù)名應(yīng)始終以一個(gè)大寫字母開(kāi)頭,以區(qū)分普通函數(shù)。返回該對(duì)象的源代碼。使您有能力向?qū)ο筇砑訉傩院头椒ā? 基本概念 ECMA關(guān)于對(duì)象的定義是:無(wú)序?qū)傩缘募希鋵傩钥梢园局?、?duì)象或者函數(shù)。對(duì)象的每個(gè)屬性或方法都有一個(gè)名字,而每個(gè)名字都映射到一個(gè)值。 類 在現(xiàn)實(shí)生活中,相似的對(duì)象之間往往都有...
摘要:可以通過(guò)構(gòu)造函數(shù)和原型的方式模擬實(shí)現(xiàn)類的功能。原型式繼承與類式繼承類式繼承是在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型的構(gòu)造函數(shù)。寄生式繼承這種繼承方式是把原型式工廠模式結(jié)合起來(lái),目的是為了封裝創(chuàng)建的過(guò)程。 js繼承的概念 js里常用的如下兩種繼承方式: 原型鏈繼承(對(duì)象間的繼承) 類式繼承(構(gòu)造函數(shù)間的繼承) 由于js不像java那樣是真正面向?qū)ο蟮恼Z(yǔ)言,js是基于對(duì)象的,它沒(méi)有類的概念。...
閱讀 2382·2021-11-24 10:33
閱讀 1450·2019-08-30 15:43
閱讀 3336·2019-08-29 17:24
閱讀 3550·2019-08-29 14:21
閱讀 2281·2019-08-29 13:59
閱讀 1789·2019-08-29 11:12
閱讀 2893·2019-08-28 18:00
閱讀 1921·2019-08-26 12:17