您好,登錄后才能下訂單哦!
JavaScript的魔法值是什么,很多新手對(duì)此不是很清楚,為了幫助大家解決這個(gè)難題,下面小編將為大家詳細(xì)講解,有這方面需求的人可以來(lái)學(xué)習(xí)下,希望你能有所收獲。
大家好,我是魚(yú)皮,今天通過(guò)一件事情,分享寫(xiě)代碼時(shí)的一個(gè)重要小技巧。
前段時(shí)間,我在編程導(dǎo)航項(xiàng)目中開(kāi)源了一段代碼,實(shí)現(xiàn)的功能是,當(dāng)用戶的操作失敗時(shí),會(huì)在頁(yè)面上彈出一個(gè)錯(cuò)誤框,并提示 “操作失敗”,代碼如下:
// 錯(cuò)誤提示 const ERROR_MESSAGE = "操作失敗"; // 刪除資源 const result = deleteResource(); if(!result) { alert(ERROR_MESSAGE); }
然而沒(méi)想到,有位同學(xué)直接留言說(shuō)我這么寫(xiě)代碼是多此一舉!為什么要單獨(dú)給 “操作失敗” 這個(gè)字符串定義一個(gè)常量呢?直接這么寫(xiě)不就好了:
// 刪除資源 const result = deleteResource(); if(!result) { alert("操作失敗"); }
似乎代碼變得更精簡(jiǎn)了,但其實(shí)這是一個(gè)常見(jiàn)的編程誤區(qū),魔法值 問(wèn)題。
什么是魔法值呢?聽(tīng)起來(lái)有點(diǎn)像游戲的藍(lán)槽 MP 哈哈。
其實(shí),魔法值和 MP 一點(diǎn)關(guān)系都沒(méi)有!
魔法值指的是代碼中沒(méi)有任何定義,直接像魔法一樣憑空出現(xiàn)的值,可以是數(shù)字、字符串等,比如:
// 輸出 console.log(1); // 彈出警告框 alert("dog");
為什么要給這種值一個(gè)名號(hào) “魔法值” 呢,因?yàn)樗鼘?duì)代碼的影響非常惡劣!
首先,魔法值會(huì)嚴(yán)重影響代碼的 可讀性 和 可維護(hù)性。
像上面的魔法字符串看起來(lái)好像沒(méi)什么問(wèn)題,但如果魔法值是數(shù)字,就必須通過(guò)閱讀其他代碼才能推斷出來(lái),比如:
if (a == 1) { alert("good"); } else if (a == 2) { alert("bad"); } else if (a == 3) { ... }
只憑這樣一段代碼,你能知道數(shù)字 1、2、3 分別是什么意思嗎?
有同學(xué)說(shuō)了,我自己寫(xiě)的代碼難道還會(huì)看不懂么?別急,過(guò)一個(gè)月你再來(lái)閱讀下這段代碼。
如果你的記憶力很好,自己一個(gè)做項(xiàng)目的時(shí)候追求點(diǎn)效率倒也無(wú)所謂了。但要是和其他同學(xué)一起做項(xiàng)目、維護(hù)代碼,寫(xiě)帶有魔法值的代碼無(wú)疑會(huì)讓他人難以理解,如果再不寫(xiě)注釋,可能他們連殺了你的心都會(huì)有了。
第二,魔法值還會(huì)影響開(kāi)發(fā)的 效率和準(zhǔn)確性。
還是拿開(kāi)頭那段代碼為例,噴我的同學(xué)根本沒(méi)有把代碼文件完整讀完,其實(shí)在該文件中,我不止一次使用到了 ERROR_MESSAGE 這一常量:
// 錯(cuò)誤提示 const ERROR_MESSAGE = "操作失敗"; // 刪除資源 const result = deleteResource(); if(!result) { alert(ERROR_MESSAGE); } // 修改資源 const result = updateResource(); if(!result) { alert(ERROR_MESSAGE); } ...
如果像他說(shuō)的一樣,不去定義常量,而是直接用魔法字符串,那么每次要彈出 “操作失敗” 時(shí),我都要重復(fù)去打這幾個(gè)字,浪費(fèi)時(shí)間的同時(shí),還存在打錯(cuò)字的風(fēng)險(xiǎn)。而如果使用預(yù)定義的常量,就能很輕松地利用開(kāi)發(fā)工具提供的代碼提示和補(bǔ)全功能。
代碼補(bǔ)全
此外,魔法值還會(huì)影響代碼的 易修改性。
假如說(shuō)同一個(gè)魔法字符串在代碼中多次出現(xiàn),那當(dāng)我要修改字符串文案時(shí),就要人工一個(gè)個(gè)地去找到這個(gè)字符串進(jìn)行修改,即使可以用開(kāi)發(fā)工具提供的搜索和全局替換功能,但也要去檢查一遍,非常麻煩。
alert("你操作失敗了"); alert("你操作失敗了"); alert("你操作失敗了");
而如果將字符串定義為常量,只用在定義處修改它的值即可。此時(shí)的常量名,倒像是魔法值的一個(gè)指針了。
const ERROR_MESSAGE = "你操作失敗了" alert("ERROR_MESSAGE"); alert("ERROR_MESSAGE"); alert("ERROR_MESSAGE");
正因?yàn)槟Хㄖ祵?duì)代碼有很大的危害,所以各種代碼規(guī)范中,都建議開(kāi)發(fā)者不要使用魔法值。
解決魔法值的方式很簡(jiǎn)單,其實(shí)上面已經(jīng)講到了,就是為一系列相同的值定義一個(gè) 常量。注意是常量,不是變量!因?yàn)槟Хㄖ档膬?nèi)容一般是固定的,其本身結(jié)構(gòu)不會(huì)被修改。
對(duì)于一系列的魔法值,建議定義為一個(gè)枚舉或單獨(dú)的常量類,比如資源有很多審核狀態(tài),可以把所有狀態(tài)集中定義。
JavaScript 代碼:
const REVIEW_STATUS = { // 待審核 WAITING: 0, // 通過(guò) PASS: 1, // 拒絕 REJECT: 2 }
Java 代碼:
public enum ReviewStatus { WAITING, PASS, REJECT }
看完上述內(nèi)容是否對(duì)您有幫助呢?如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章,請(qǐng)關(guān)注億速云行業(yè)資訊頻道,感謝您對(duì)億速云的支持。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。