JS根據(jù)動(dòng)態(tài)生成的字符串，驗(yàn)證是否存在對(duì)應(yīng)function并執(zhí)行

CollinPeng 發(fā)布于2019-08-22 10:59 / 2011人閱讀

摘要：有個(gè)挫一點(diǎn)的方法寫個(gè)，根據(jù)目前要跳到哪個(gè)頁面，來判斷執(zhí)行哪個(gè)這種方法是，就是維護(hù)起來不方便，以后每添一個(gè)新頁面都要來維護(hù)這個(gè)。

這個(gè)需求是在我搭建前端項(xiàng)目框架的時(shí)候遇到的：

由于我走的是前后端完全分離的路線，那前端部分少了后端的支持，所以就少不了要做點(diǎn)路由、分發(fā)之類的工作，而在用路由跳轉(zhuǎn)到新的“頁面”后，我需要執(zhí)行相應(yīng)的function來獲取第一版的數(shù)據(jù)。有個(gè)挫一點(diǎn)的方法：寫個(gè)switch，根據(jù)目前要跳到哪個(gè)頁面，來判斷執(zhí)行哪個(gè)function；這種方法work是work，就是維護(hù)起來不方便，以后每添一個(gè)新“頁面”都要來維護(hù)這個(gè)switch。

PHP有個(gè)很不錯(cuò)的動(dòng)態(tài)機(jī)制：


用這個(gè)動(dòng)態(tài)機(jī)制來做路由非常方便，因此在做前端框架的路由的時(shí)候，我就想著會(huì)不會(huì)有類似的解決方案呢？
答案是有的，利用JS的eval函數(shù)（PHP也有同名函數(shù)），就可以通過拼字符串來執(zhí)行JS代碼了，下面是例子：
function test() {
    alert(111);
};

var functionName ="test";

if(typeof(window[functionName]) === "function") {
    eval(functionName + "()");
}

值得注意的是判斷字符串對(duì)應(yīng)的function是否存在（對(duì)于一個(gè)框架來說會(huì)靈活得多，比如說：不是每一個(gè)頁面都需要獲取第一版數(shù)據(jù)），我試過用jquery的$.isFunction和原生typeof方法與eval函數(shù)配合，都無法識(shí)別到對(duì)應(yīng)的function，最后還是靠window[functionName]獲取到function對(duì)應(yīng)的變量，這樣才能進(jìn)行判斷。

云服務(wù)器 GPU云服務(wù)器動(dòng)態(tài)編譯并執(zhí)行字符串前端js驗(yàn)證碼的生成 js根據(jù)表格數(shù)據(jù)生成柱狀圖動(dòng)態(tài)生成驗(yàn)證碼

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/91571.html

相關(guān)文章

前端知識(shí)點(diǎn)(一)

摘要：為了解決協(xié)議的這一缺陷，需要使用另一種協(xié)議安全套接字層超文本傳輸協(xié)議，為了數(shù)據(jù)傳輸?shù)陌踩?，在的基礎(chǔ)上加入了協(xié)議，依靠證書來驗(yàn)證服務(wù)器的身份，并為瀏覽器和服務(wù)器之間的通信加密。是超文本傳輸協(xié)議，信息是明文傳輸，則是具有安全性的加密傳輸協(xié)議。 1、請(qǐng)說說從用戶輸入url到呈現(xiàn)網(wǎng)頁，這中間都發(fā)生了什么？ 1、域名解析域名解析的過程：　　 1）.查詢?yōu)g覽器自身DNS緩存 ...

tinylcy 2019-08-30 15:55 評(píng)論0 收藏0
前端知識(shí)點(diǎn)(一)

摘要：為了解決協(xié)議的這一缺陷，需要使用另一種協(xié)議安全套接字層超文本傳輸協(xié)議，為了數(shù)據(jù)傳輸?shù)陌踩?，在的基礎(chǔ)上加入了協(xié)議，依靠證書來驗(yàn)證服務(wù)器的身份，并為瀏覽器和服務(wù)器之間的通信加密。是超文本傳輸協(xié)議，信息是明文傳輸，則是具有安全性的加密傳輸協(xié)議。 1、請(qǐng)說說從用戶輸入url到呈現(xiàn)網(wǎng)頁，這中間都發(fā)生了什么？ 1、域名解析域名解析的過程：　　 1）.查詢?yōu)g覽器自身DNS緩存 ...

defcon 2019-08-02 14:07 評(píng)論0 收藏0
前端知識(shí)點(diǎn)(一)

摘要：為了解決協(xié)議的這一缺陷，需要使用另一種協(xié)議安全套接字層超文本傳輸協(xié)議，為了數(shù)據(jù)傳輸?shù)陌踩诘幕A(chǔ)上加入了協(xié)議，依靠證書來驗(yàn)證服務(wù)器的身份，并為瀏覽器和服務(wù)器之間的通信加密。是超文本傳輸協(xié)議，信息是明文傳輸，則是具有安全性的加密傳輸協(xié)議。 1、請(qǐng)說說從用戶輸入url到呈現(xiàn)網(wǎng)頁，這中間都發(fā)生了什么？ 1、域名解析域名解析的過程：　　 1）.查詢?yōu)g覽器自身DNS緩存 ...

iliyaku 2019-08-23 14:41 評(píng)論0 收藏0
jQuery中的選擇器引擎Sizzle

摘要：生成終極匹配器主要是返回一個(gè)匿名函數(shù)，在這個(gè)函數(shù)中，利用方法生成的匹配器，去驗(yàn)證種子集合，篩選出符合條件的集合。在這個(gè)終極匹配器中，會(huì)將獲取到的種子元素集合與匹配器進(jìn)行比對(duì)，篩選出符合條件的元素。讀Sizzle的源碼，分析的Sizzle版本號(hào)是2.3.3。 Sizzle的Github主頁瀏覽器原生支持的元素查詢方法：方法名方法描述兼容性描述 getElementBy...

elisa.yang 2019-08-22 18:41 評(píng)論0 收藏0
JS基礎(chǔ)知識(shí)學(xué)習(xí)（三）

摘要：基礎(chǔ)知識(shí)字符串中常用的方法在中用單雙引號(hào)包裹起來的都是字符串字符串就是由到多個(gè)字符組成的特點(diǎn)一以數(shù)字作為索引，從零開始特點(diǎn)二有屬性，存儲(chǔ)的是當(dāng)前字符串中字符的個(gè)數(shù)字符長度如果指定的索引不存在獲取的結(jié)果是真實(shí)項(xiàng)目中，我們經(jīng)常操作字符串，此時(shí) js基礎(chǔ)知識(shí) JavaScript 字符串中常用的方法在JS中用單（雙）引號(hào)包裹起來的都是字符串 var str=welcome to my ho...

keke 2019-08-22 18:18 評(píng)論0 收藏0