摘要:中的有多重意義。它可能是一個構造器,承擔起對象模板的作用可能是對象的方法,負責向對象發(fā)送消息。語義匿名函數處理某些特殊效果如處理一些數據又不想暴露過多的變量判斷版本的方式最終只要一個結果,匿名函數內部用到了一些局部變量全部可以隔離開。
JavaScript 中的 function 有多重意義。它可能是一個構造器(constructor),承擔起對象模板的作用; 可能是對象的方法(method),負責向對象發(fā)送消息。還可能是函數,沒錯是函數,和對象沒有任何關系獨立存在的可以被調用的函數。
由于語言設計者的妥協(xié),在 JavaScript 加入了一些 class 相關的特性,以使 JavaScript 看起來確實象 Java,可以 “面向對象”。雖然 JavaScript 添加了 new 和 this, 但卻沒有 class (ES已加)。最后 function 臨時擔負起 class 的任務。
語義1:作為構造器的 function
/**
*
@class Tab
@param nav {string} 頁簽標題的class
@param content {string} 頁面內容的class
*
*/
function Tab(nav, content) {
this.nav = nav;
this.content = content;
}
Tab.prototype.getNav = function() {
return this.nav;
};
Tab.prototype.setNav = function(nav) {
this.nav = nav;
};
Tab.prototype.add = function() {
};
// 創(chuàng)建對象
var tab = new Tab("tab-nav", "tab-content");
這里定義了一個類 Tab,創(chuàng)建了一個對象 tab。以上使用了 function ,this, new。this, new 是常見的面向對象語言中的關鍵字, 這里的 function 則擔負傳統(tǒng)面向對象語言中的 class 作用。當然這時候標識符的命名一般遵循 “首字母大寫” 規(guī)則。
語義2:作為對象方法的 function
由于 JavaScript 中無需類也可以直接創(chuàng)建對象,因此有兩種方式給對象添加方法。第一種先定義類,方法掛在原型上,如上例的 Tab,原型上有 getNav、setNav 和 add 方法。以下還有一種,直接在 function 內的 this 上添加方法。
function Tab(nav, content) {
this.nav = nav
this.content = content
this.getNav = function() {
// ...
}
this.setNav = function() {
// ...
}
this.add = function() {
// ...
}
}
這里 Tab 是語義, this.getNav/this.setNav/this.add 是語義,作為對象的方法。 另外,可以直接定義對象及其方法
var tab = {
nav: "",
content: "",
getNav: function() {
// ...
},
setNav: function() {
// ...
},
add: function() {
// ...
}
}
tab.getNav/tab.setNav/tab.add 是語義,作為對象 tab 的方法。
語義3:作為獨立的函數
?
/*
判斷對象是否是一個空對象
@param obj {Object}
@return {boolean}
*/
function isEmpty(obj) {
for (var a in obj) {
return false
}
return true
}
// 定義一個模塊
~function() {
// 輔助函數
function now() {
return (new Date).getTime()
}
// 模塊邏輯...
}();
// 采用CommonJS規(guī)范的方式定義一個模塊
define(require, exports, moduel) {
// 輔助函數
function now() {
return (new Date).getTime()
}
// 模塊邏輯...
})
isEmpty 作為一個全局函數存在,模塊定義里面的 now 則作為局部函數存在,無論 isEmpty 還是 now 這里的 function 都指函數,它不依賴與對象和類,可以獨立被調用。
語義4:匿名函數定義模塊
// 全局命名空間
var RUI = {}
// ajax.js
~function(R) {
// 輔助函數...
ajax = {
request: function() { // ... } getJSON: function() { // ... } ...
}
// 暴露出模塊給 R
R.ajax = ajax
}(RUI);
// event.js
~function(R) {
// 輔助函數...
// 事件模塊定義...
// 暴露出模塊給 R
R.event = event
}(RUI);
// dom.js
~function(R) {
// 輔助函數...
// DON模塊定義...
// 暴露出模塊給 R
R.dom = dom
}(RUI);
這里的匿名函數執(zhí)行后把API對象暴露給了RUI,無論匿名函數內干了多少活,對應匿名函數外是看不到的,也是沒有必要去理會的。最終關心的是公開的 API 方法,只要了解這些方法的參數及意義就可以馬上使用它了。
語義5:匿名函數處理某些特殊效果如處理一些數據又不想暴露過多的變量
// 判斷IE版本的hack方式
var IEVersion = function() {
var undef, v =
var div = document.createElement("div")
var all = div.getElementsByTagName("i")
while (
div.innerHTML = "", all[]
);
return v > ? v : undef
}();
最終只要一個結果 IEVersion,匿名函數內部用到了一些局部變量全部可以隔離開。這種方式對于一些臨時性的數據加工非常有效,緊湊。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規(guī)行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103374.html
摘要:針對上面看到的問題,現在也有一些團隊在嘗試前后端之間加一個中間層比如淘寶的。淘寶有很多類似的文章,這里不贅述。淘寶團隊做了兩套接口文檔的維護工具,以及,不知道有沒有對外開放,兩個東西都是基于的一個嘗試,各有優(yōu)劣。 原文出處: 小胡子哥的博客(@Barret李靖) 前后端分工協(xié)作是一個老生常談的大話題,很多公司都在嘗試用工程化的方式去提升前后端之間交流的效率,降低溝通成本,并且也開發(fā)了...
摘要:針對上面看到的問題,現在也有一些團隊在嘗試前后端之間加一個中間層比如淘寶的。淘寶有很多類似的文章,這里不贅述。淘寶團隊做了兩套接口文檔的維護工具,以及,不知道有沒有對外開放,兩個東西都是基于的一個嘗試,各有優(yōu)劣。 原文出處: 小胡子哥的博客(@Barret李靖) 前后端分工協(xié)作是一個老生常談的大話題,很多公司都在嘗試用工程化的方式去提升前后端之間交流的效率,降低溝通成本,并且也開發(fā)了...
摘要:針對上面看到的問題,現在也有一些團隊在嘗試前后端之間加一個中間層比如淘寶的。淘寶有很多類似的文章,這里不贅述。淘寶團隊做了兩套接口文檔的維護工具,以及,不知道有沒有對外開放,兩個東西都是基于的一個嘗試,各有優(yōu)劣。 原文出處: 小胡子哥的博客(@Barret李靖) 前后端分工協(xié)作是一個老生常談的大話題,很多公司都在嘗試用工程化的方式去提升前后端之間交流的效率,降低溝通成本,并且也開發(fā)了...
摘要:但好在還給我們提供了一個方法,每一個對象都有這樣一個方法,專門用來判斷某個屬性是否是該對象的私有屬性。如果你想要用對象字面形式,你只能在創(chuàng)建對象時定義訪問器屬性。在中,我們使用凍結一個對象,并且使用來判斷一個對象是否被凍結。 說完了對象那些不常用的冷知識,是時候來看看JavaScript中對象屬性有哪些有意思的東西了。 不出你所料,對象屬性自然也有其相應的特征屬性,但是這個話題有點復雜...
摘要:換句話說,定義在閉包中的函數可以記憶它被創(chuàng)建時候的環(huán)境。詞法環(huán)境的概念定義摘自百科。一個詞法環(huán)境由一個環(huán)境記錄項和可能為空的外部詞法環(huán)境引用構成。中使用詞法環(huán)境管理靜態(tài)作用域。 一個資深的同事在我出發(fā)去面試前告誡我,問JS知識點的時候千萬別主動提閉包,它就是一個坑啊!坑啊!??! 閉包確實是js的難點和重點,其實也沒那么可怕,關鍵是機制的理解,可以和函數一起單獨拿出來說說,其實關于閉包的...
閱讀 2572·2021-09-23 11:21
閱讀 1882·2021-09-22 15:15
閱讀 970·2021-09-10 11:27
閱讀 3440·2019-08-30 15:54
閱讀 651·2019-08-30 15:52
閱讀 1335·2019-08-30 15:44
閱讀 2349·2019-08-29 15:06
閱讀 2972·2019-08-28 18:21