如何用JavaScript動(dòng)態(tài)呼叫函數(shù)(兩種方式)
更新時(shí)間:2013年05月03日 16:07:46 作者:
下面介紹一下動(dòng)態(tài)呼叫函數(shù)目前應(yīng)該有下面兩種方式,它們之間的使用及對(duì)比,感興趣的朋友可以研究下,希望可以幫助到你
近來(lái)的使用者,越來(lái)越強(qiáng)調(diào) UI 介面的互動(dòng),漸漸原本對(duì)一條小龍來(lái)說(shuō)只是配角的 JavaScript (以下簡(jiǎn)稱 JS) 變成的主角,占了很大一塊的用途。
像是最近很熱門的 ASP.NET 的 MVC 里面就直接Include JQuery 可見(jiàn)一般。
MVC 用了一陣子,一條小龍甚至感覺(jué) MVC 中的 Controller 根本就是 JS 在控制的,這樣怎么把 UI 工作獨(dú)立,切給美工用,感覺(jué)也是蠻大的疑問(wèn)。
看來(lái)后面的美工,只會(huì)繪圖、拉畫面是不行的,一定要會(huì) JS、Flash 等等前端控制語(yǔ)言,才會(huì)吃香。
這邊,一條小龍介紹一下,如何用 JavaScript 動(dòng)態(tài)呼叫函數(shù),這個(gè)時(shí)候需要先介紹一下 前提,這樣讀者才能了解,下面的技術(shù)能應(yīng)用在哪里。
一般會(huì)使用到 動(dòng)態(tài)呼叫,基本上都是 后端動(dòng)態(tài)產(chǎn)生 JS的程式碼,在由前端的 JS 框架,來(lái)呼叫使用。
會(huì)需要這樣做的用途,不外乎,動(dòng)態(tài)設(shè)定 UI 的欄位、樣式、資料 等等,另外一種可能,就是保留 JS 框架的擴(kuò)充性,讓后面的開發(fā)人員,可以根據(jù)每只程式的特性,在額外編寫代碼來(lái)擴(kuò)充原有JS 框架的功能。
下面 就來(lái)介紹一下,動(dòng)態(tài)呼叫函數(shù) 目前就一條小龍所知應(yīng)該有下面 兩種方式
function myAlert(value) {
document.write("myAlert - " + value + "<br>");
}
$(function () {
eval("myAlert")("test");
window["myAlert"]("test");
}
一般來(lái)說(shuō),比較正規(guī)還是要使用 window 這個(gè)object 來(lái)查詢 function 是否存在,用 eval 彈性太大比較有風(fēng)險(xiǎn)。
而且直接照上述來(lái)實(shí)作,會(huì)有蠻大風(fēng)險(xiǎn),一但被呼叫的函數(shù)不存在,整個(gè)畫面就會(huì)出錯(cuò),所以 在使用上,需再加上判斷式,從這角度這時(shí)eval 就無(wú)法使用了,因?yàn)槭褂?eval 就是要產(chǎn)生 function 這個(gè) object 了,而 window 只是查詢有無(wú) object,所以當(dāng) function 不存在,eval 就會(huì)直接報(bào)錯(cuò)了,這樣 讀者應(yīng)該比較能了解其中差異。
范例程式如下
function myAlert(value) {
document.write("myAlert - " + value + "<br>");
}
$(function () {
var fnName = "myAlert";
var fn = window[fnName];
if (typeof fn == "function") {
fn.apply(window, ["window - test"]);
}
}
最后,是我自己又另外想出的一種方式,如下
function myAlert(value) {
document.write("myAlert - " + value + "<br>");
}
$(function () {
if (typeof (myAlert) == 'function') {
myAlert("typeof - test");
}
}
雖然這種方式會(huì)犧牲一些彈性,但相反卻可以用這種方式,來(lái)限制后續(xù)開發(fā)人員的命名原則,例如像是框架中的 Init() Load() 等等,皆可用如此方式則可以將使用方式固定下來(lái),不至于發(fā)散出去,也方便后續(xù)的維護(hù)成本。
像是最近很熱門的 ASP.NET 的 MVC 里面就直接Include JQuery 可見(jiàn)一般。
MVC 用了一陣子,一條小龍甚至感覺(jué) MVC 中的 Controller 根本就是 JS 在控制的,這樣怎么把 UI 工作獨(dú)立,切給美工用,感覺(jué)也是蠻大的疑問(wèn)。
看來(lái)后面的美工,只會(huì)繪圖、拉畫面是不行的,一定要會(huì) JS、Flash 等等前端控制語(yǔ)言,才會(huì)吃香。
這邊,一條小龍介紹一下,如何用 JavaScript 動(dòng)態(tài)呼叫函數(shù),這個(gè)時(shí)候需要先介紹一下 前提,這樣讀者才能了解,下面的技術(shù)能應(yīng)用在哪里。
一般會(huì)使用到 動(dòng)態(tài)呼叫,基本上都是 后端動(dòng)態(tài)產(chǎn)生 JS的程式碼,在由前端的 JS 框架,來(lái)呼叫使用。
會(huì)需要這樣做的用途,不外乎,動(dòng)態(tài)設(shè)定 UI 的欄位、樣式、資料 等等,另外一種可能,就是保留 JS 框架的擴(kuò)充性,讓后面的開發(fā)人員,可以根據(jù)每只程式的特性,在額外編寫代碼來(lái)擴(kuò)充原有JS 框架的功能。
下面 就來(lái)介紹一下,動(dòng)態(tài)呼叫函數(shù) 目前就一條小龍所知應(yīng)該有下面 兩種方式
復(fù)制代碼 代碼如下:
function myAlert(value) {
document.write("myAlert - " + value + "<br>");
}
$(function () {
eval("myAlert")("test");
window["myAlert"]("test");
}
一般來(lái)說(shuō),比較正規(guī)還是要使用 window 這個(gè)object 來(lái)查詢 function 是否存在,用 eval 彈性太大比較有風(fēng)險(xiǎn)。
而且直接照上述來(lái)實(shí)作,會(huì)有蠻大風(fēng)險(xiǎn),一但被呼叫的函數(shù)不存在,整個(gè)畫面就會(huì)出錯(cuò),所以 在使用上,需再加上判斷式,從這角度這時(shí)eval 就無(wú)法使用了,因?yàn)槭褂?eval 就是要產(chǎn)生 function 這個(gè) object 了,而 window 只是查詢有無(wú) object,所以當(dāng) function 不存在,eval 就會(huì)直接報(bào)錯(cuò)了,這樣 讀者應(yīng)該比較能了解其中差異。
范例程式如下
復(fù)制代碼 代碼如下:
function myAlert(value) {
document.write("myAlert - " + value + "<br>");
}
$(function () {
var fnName = "myAlert";
var fn = window[fnName];
if (typeof fn == "function") {
fn.apply(window, ["window - test"]);
}
}
最后,是我自己又另外想出的一種方式,如下
復(fù)制代碼 代碼如下:
function myAlert(value) {
document.write("myAlert - " + value + "<br>");
}
$(function () {
if (typeof (myAlert) == 'function') {
myAlert("typeof - test");
}
}
雖然這種方式會(huì)犧牲一些彈性,但相反卻可以用這種方式,來(lái)限制后續(xù)開發(fā)人員的命名原則,例如像是框架中的 Init() Load() 等等,皆可用如此方式則可以將使用方式固定下來(lái),不至于發(fā)散出去,也方便后續(xù)的維護(hù)成本。
您可能感興趣的文章:
- 基于js里調(diào)用函數(shù)時(shí),函數(shù)名帶括號(hào)和不帶括號(hào)的區(qū)別
- javascript獲取函數(shù)名稱、函數(shù)參數(shù)、對(duì)象屬性名稱的代碼實(shí)例
- js函數(shù)名與form表單元素同名沖突的問(wèn)題
- js類中獲取外部函數(shù)名的方法與代碼
- js類中獲取外部函數(shù)名的方法
- 關(guān)于動(dòng)態(tài)執(zhí)行代碼(js的Eval)實(shí)例詳解
- javascript中動(dòng)態(tài)函數(shù)用法實(shí)例分析
- JS函數(shù)實(shí)現(xiàn)動(dòng)態(tài)添加CSS樣式表文件
- JavaScript動(dòng)態(tài)插入script的基本思路及實(shí)現(xiàn)函數(shù)
- 如何實(shí)現(xiàn)動(dòng)態(tài)刪除javascript函數(shù)
- JavaScript 動(dòng)態(tài)添加腳本,并觸發(fā)回調(diào)函數(shù)的實(shí)現(xiàn)代碼
- JS動(dòng)態(tài)插入并立即執(zhí)行回調(diào)函數(shù)的方法
- 詳解js的事件處理函數(shù)和動(dòng)態(tài)創(chuàng)建html標(biāo)記方法
- javascript實(shí)現(xiàn)根據(jù)函數(shù)名稱字符串動(dòng)態(tài)執(zhí)行函數(shù)的方法示例
相關(guān)文章
解決WordPress使用CDN后博文無(wú)法評(píng)論的錯(cuò)誤
這篇文章主要介紹了解決WordPress使用CDN后博文無(wú)法評(píng)論的錯(cuò)誤的方法,同時(shí)提醒注意WordPress使用版本的jQuery版本支持度,需要的朋友可以參考下2015-12-12基于JavaScript實(shí)現(xiàn)購(gòu)物網(wǎng)站商品放大鏡效果
大家在日常生活中都有網(wǎng)購(gòu)的經(jīng)驗(yàn),有的網(wǎng)站會(huì)有商品放大鏡功能,效果非常棒,那么基于js代碼是如何實(shí)現(xiàn)的呢?下面小編給大家?guī)?lái)了基于js實(shí)現(xiàn)購(gòu)物網(wǎng)站商品放大鏡效果,非常不錯(cuò),感興趣的朋友參考下吧2016-09-09js實(shí)現(xiàn)回放拖拽軌跡從過(guò)程上進(jìn)行分析
今天的記錄,記錄回放拖拽痕跡,先從過(guò)程上進(jìn)行分析,需要的朋友可以參考下2014-06-06javascript實(shí)現(xiàn)tab切換的兩個(gè)實(shí)例
這篇文章主要介紹了javascript實(shí)現(xiàn)tab切換的兩個(gè)實(shí)例,是對(duì)之前方法原理的進(jìn)一步延伸,需要深入了解的同學(xué)可以參考一下2015-11-11JS輸出空格的簡(jiǎn)單實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇JS輸出空格的簡(jiǎn)單實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09密碼強(qiáng)度檢測(cè)效果實(shí)現(xiàn)原理與代碼
密碼強(qiáng)度檢測(cè)有利于提醒增加密碼的安全指數(shù),更好的保護(hù)密碼安全,接下來(lái)介紹密碼強(qiáng)度檢測(cè)效果的實(shí)現(xiàn)2013-01-01JS使用AudioContext實(shí)現(xiàn)音頻流實(shí)時(shí)播放
這篇文章主要為大家詳細(xì)介紹了JavaScript如何使用AudioContext實(shí)現(xiàn)音頻流實(shí)時(shí)播放功能,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-01-01