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