1. 程式人生 > >說明你javascript寫的很爛的5個問題

說明你javascript寫的很爛的5個問題

Javascript在網際網路上名聲很臭,但你又很難再找到一個像它這樣如此動態、如此被廣泛使用、如此根植於我們的生活中的另外一種語言。它的低學習門檻讓很多人都稱它為學前指令碼語言,它另外一個讓人嘲笑的東西是動態語言的概念是偏偏使用了高標準的靜態資料型別。其實,你和Javascript都站錯了立場,而現在,你讓Javascript很生氣。這裡有五個原因能說明你的Javascript技術很爛。
1. 你沒有使用名稱空間。

是否還記得在大學裡老師告訴你不要在家庭作業裡使用全域性變數?Javascript裡的全域性變數的使用方法也不例外。Web網頁稍不留神就會變的混亂不堪、到處都是從網際網路上各個角落裡找來的亂糟糟的相互侵犯的指令碼和指令碼庫。如果你把一個變數命名成loader(),那你是成心自找麻煩。如果你在無意識的情況下過載了一個函式,Javascript根本不會提醒你。你還把它叫做一種學前教育程式語言,還記得吧?我要說的是,你需要知道在做了這些後發生什麼情況。

function derp() { alert(“one”); }
function derp() { alert(“two”); }
derp();

“two”,答案是“two”。並不是一定會這樣,它也可能是“one”。所以,把你所有的程式碼都放在自己的名稱空間裡,這很容易。下面是定義自己的名稱空間的一個簡單做法。

var foospace={};
foospace.derp=function() { alert(“one”); }
function derp() { alert(“two”); }
foospace.derp();

2. 你在變戲法,你把變數定義的東一個西一個。

你使用莫名其妙的數字字母組合作為變數名是一個雙輸的結局。在40行的程式碼塊了中尋找一個不帶任何表意的字元變數,對於維護工作來說簡直是場噩夢。把對變數的第一次宣告混合到一個40行的程式碼塊裡同樣也是一場噩夢。即使你自己遇到這樣的變數時,你也要不由的問自己:“這是在哪裡定義的?”,然後迅速的使用Ctrl+F組合在原始碼裡尋找這個變數最初定義的位置。不,不要這樣,相反,這是對Javascript的濫用,是一種愚蠢的做法。你應該始終把變數定義在它的使用範圍的頂部。並不能說因為這不是必須的,你就可以不這樣做。

function() {
var a, //description
b; //description
//process…
}

3. 你沒有理解Javascript的變數範圍。

你是個天才的程式設計師,你吃的是C++、拉的是List。你知道什麼是變數範圍,你對你的變數有完全的控制,你就像太上皇似的的注視著它們。然而,Javascript卻在你的咖啡里拉了一泡屎,並且大笑不止。

var herp=”one”;
{
var herp=”two”;
}
alert(herp);

在這種情況下你得到的herp不是“one”,而是“two”。Javascript的變數有效範圍並不是跟其它語言一樣依賴於程式碼塊。Javascript的變數範圍是以函式為基礎的。每個函式都有它自己的變數範圍,Javascript這一點上表現的很酷,根本不理睬這毫無意義的花括弧包起來的範圍。事實上,Javascript是如此的酷,以至於你甚至可以將變數範圍像名稱空間或變數那樣進行傳遞。
4. 你以為Javascript的面向物件特徵只是嫁接而來的。

Javascript,自從呱呱落地起,它就是一個面向物件的語言。所有的東西在Javascript裡都是物件,所有的!甚至數字和字元這樣的文字元號都可以通過它自身固有的構造器轉化成物件。跟其它面向物件的語言比起來,Javascript的不同之處在於,它沒有類(class)。Javascript物件像函式那樣定義,甚至函式自己也是物件。Javascript有個屬性叫做prototype,所有物件裡都內建了這個屬性,你可以通過它來改變物件的構造,修改物件、新增更多的變數、更多的功能。

var derp; // will hold a Herp instance
var Herp= function() {
this.opinion=”Javascript is cooler than BASIC.”;
}
Herp.prototype.speak=function() { alert(this.opinion); }
var derp= new Herp();
derp.speak();

如果這個看起來跟你毫不相干,我願意介紹我的好朋友Google給你,Google擅長於幫助人們學習知識。面向物件對於我這篇簡短的、低姿態的文章來說實在是個太大的話題。
5. 你使用“new”關鍵字時就像是盲人瞎馬。

Javascript肯定是你的初戀女友,因為你顯得無所適從。如果你想像真人那樣取悅Javascript,你需要去了解物件符號。除了在需要例項化一個物件,或罕見的需要延時載入資料的情況外,你基本上不需要使用new關鍵字。在Javascript裡分配大量的new變數地址是一項很慢的操作,為了效率起見,你應該始終使用物件符號。

var rightway= [1, 2, 3];
var wrongway= new Array(1, 2, 3);

是否還記得我說過Javascript的變數範圍是以函式為基礎的?是否還記得有人說Javascript的物件像函式那樣定義?如果你不使用new關鍵字來宣告一個物件,你將會使這個物件成為全域性範圍內的物件。所以,永遠使用new關鍵字來宣告物件是一個好習慣。

var derp=”one”;
var Herp=function() {
this.derp=”two”;
}
var foo=Herp();
alert(derp);

如果你這樣寫,Javascript並不會在意,而你真正彈出的答案是“two”!有很多方法可以防止物件做出這樣的行為,可以以使用instanceOf,但更好的方法是正確的使用new關鍵字,這樣顯得更專業。

現在你知道你的Javascript程式碼寫的很爛了吧,如果你記住了上面所說的東西,你的程式碼就會有所改善。我喜歡用3個tab鍵來縮排程式碼,我喜歡用下劃線來連線單詞,我喜歡把函式名首字母大寫來表示它是物件。當然,這個是另外一場討論了。有很多原因會導致你的Javascript程式碼寫的很爛,就像我有很多技術很爛一樣,所以,盡情的在評論裡表達你的意見,支援,反對,不吝賜教

相關推薦

說明javascript5問題

Javascript在網際網路上名聲很臭,但你又很難再找到一個像它這樣如此動態、如此被廣泛使用、如此根植於我們的生活中的另外一種語言。它的低學習門檻讓很多人都稱它為學前指令碼語言,它另外一個讓人嘲笑的東西是動態語言的概念是偏偏使用了高標準的靜態資料型別。其實,你和Javasc

能說明Javascript技術的五原因

1.你沒有使用名稱空間 是否還記得在大學裡老師告訴你不要在家庭作業裡使用全域性變數?Javascript裡的全域性變數的使用方法也不例外。Web網頁稍不留神就會變的混亂不堪、到處都是從網際網路上各個角落裡找來的亂糟糟的相互侵犯的指令碼和指令碼庫。如果你把一個變數命名成lo

JavaScript條件語句的5技巧

1、使用Array.includes處理多種條件 讓我們來看一下的例子: // conditionfunction test(fruit) { if (fruit == 'apple' || fruit == 'strawberry') { console.log('red');

【譯】JavaScript條件語句的5技巧

譯文 當我們寫JavaScript程式碼時,經常會用到到條件判斷處理,這裡有5個技巧能使你寫出更好、更簡潔的條件語句。 1、使用Array.includes處理多種條件 讓我們來看一下的例子: // conditionfunction test(fruit) { if (fruit == 'apple' ||

為什麼Javascript技術

Javascript在網際網路上名聲很臭,但你又很難再找到一個像它這樣如此動態、如此被廣泛使用、如此根植於我們的生活中的另外一種語言。它的低學習門檻讓很多人都稱它為學前指令碼語言,它另外一個讓人嘲笑的東西是動態語言的概念是偏偏使用了高標準的靜態資料型別。其實,你和Javasc

最常見到的5runtime&nbs…

所謂系統異常,就是…..,它們都是RuntimeException的子類,在jdk doc中查RuntimeException類,就可以看到其所有的子類列表,也就是看到了所有的系統異常。我比較有印象的系統異常有:NullPointerException、ArrayIndexOutOfBoundsExc

【廣州服務器回收】服務器維護過程中,需要了解的5小常識

windows ron 就是 圖片 渲染 天都 驚人的 領域 其他人 大多數人認為,服務器僅僅是升級後的臺式機。但任何在數據中心工作過的人都知道,它們的差別挺大的。 盡管web服務器每天都要承擔數百萬訪問者的負載,但對於普通用戶來說,它們仍然神秘莫測。以下是關於服務器你可能

別讓速度限制了的工資!這5實用高效的Word技巧趕快學起來!

在Word中F4鍵大有用處,不僅用起來酷炫,還能讓你的工作效率直線上升,真的超級實用。今天小編就給大家分享5個Word技巧,一起來看看吧!別讓速度限制了你的工資!這5個實用高效的Word技巧趕快學起來!1.快速統一圖片的大小尺寸 在Word文件中插入一些圖片,點選第一張圖片並設定格式大小,按住F4點選其他圖

設計開發必須了解的5方面

需要 分享 測試 做了 解決方案 問題 成功 準備 應該 大多數產品開發周期都是以設計開始,以開發結束,但我認為,好的產品從一開始就將設計開發和技術結合在一起,綜合考慮技術和設計可以減少兩者間的切換(以及低效率的問題),釋放出兩種技能的創造潛力。 通過這種合作方式,Work

改進的c#程式碼的5技巧(一)

親愛的讀者,在這篇文章中,我提供了一些c#程式設計的最佳實踐。 你是否在使用者輸入驗證中使用異常處理機制? 如果是,那麼你就是那個把你的專案執行速度降低了62倍的人。你不相信我嗎?等幾分鐘;我來教你怎麼做。但是在這個例子之前,讓我們瞭解一下在什麼地方需要異常處理。 例如,你正在驗證使用者的資料,對於任何無

改進的c#程式碼的5技巧(二)

在本文中,我將向你展示c#程式設計的5個最佳實踐。我從日常程式設計經驗中學到了這些實踐。我在release模式下測試了所有的程式碼,並在開發環境穩定後進行了截圖。我想你會喜歡這些建議的。 在使用資料型別之前選擇它 對於許多型別,我們寧願不決定在日常程式設計生活中使用什麼資料型別。就在幾個月前,我也是其中之

改進的c#程式碼的5技巧(三)

本文完全獨立於前兩篇文章。如果你喜歡它們,我希望你也會喜歡這個。在上一篇文章中,我展示了哪種方法更快,並比較了程式碼的執行速度。在本文中,我將展示不同程式碼片段的記憶體消耗情況。為了顯示記憶體對映和分配圖,我使用了CLR profiler 32位版本,和往常一樣,我在Windows平臺上使用了4GB RAM和

改進的c#程式碼的5技巧(四)

像每一篇文章一樣,我會重複幾行。我在我的Core i3 CPU、4GB主記憶體和Windows 7平臺上測試了以下程式碼。如果你在不同的硬體配置或使用不同的平臺,那麼你的輸出可能會隨著我的輸出螢幕而變化,並且輸出可能會根據當前執行的程序而變化。由於所有的點都是效能測試,我已經在釋出模式下對它們進行了測試,並在

以事實駁斥:改進的c#程式碼的5技巧(四)

  測試使用的環境:vs2019+.net core3.1   原文地址:https://www.cnblogs.com/hhhnicvscs/p/14296715.html   反駁第一條:如何檢查程式碼中的空字串?      調整順序後輸出,

做好5javascript細節,別讓人看出

JavaScript在網際網路上名聲很臭,但你又很難再找到一個像它這樣如此動態、如此被廣泛使用、如此根植於我們的生活中的另外一種語言。它的低學習門檻讓很多人都稱它為學前指令碼語言,它另外一個讓人嘲笑的東西是動態語言的概念是偏偏使用了高標準的靜態資料型別。其實,你和JavaS

JavaScript5技巧幫助出更好的條件語句

使用JavaScript時,我們會遇到很多的條件語句,這裡有5個技巧能幫助你寫出更好/簡潔的條件語句。 對多個條件使用Array.includes 更少巢狀,儘早return 使用預設的函式引數和解構 支援Map / Object 語法而不是Sw

5小技巧讓出更好的 JavaScript 條件語句

來源:掘金,譯者:Hopsken 連結:https://juejin.im/post/5bb9e3085188255c352d7326 作者:@Jecelyn Yeen 原文:https://scotch.io/tutorials/5-tips-to-write-better-conditi

更好的表達“的程式碼的”的方法

如果你有一個同事,他寫的程式與其說是程式碼,不如說更像希臘神話中女妖美杜莎的頭髮,你當然不能熟視無睹,你應該做出一些反應,但你可選的合適的反應方式並沒有多少:自己默默的幫他整理清楚、向上級抱怨、向其他同事背後嘮叨此事、悶在心裡直到憋不住,或者這最大膽的方法:走上去直接對爛程式設計師說他的程式碼很爛。

分享5超級一流的黑科技軟體,每個功能都強大,值得擁有!

1.Convertow   一個線上免費的不同檔案轉換工具。支援多種圖片格式轉換為PDF,方便使用者輕鬆實現各種需求轉換,無需安裝任何外掛或軟體即可實現。同時支援TIFF、PNG、JPG、BMP檔案轉換為PDF,也可以在圖片的不同格式間進行轉換,例如JPG到PNG、PNG到J

Python 時的 5 壞習慣,有幾條?

很多文章都有介紹怎麼寫好 Python,我今天呢,相反,說說寫程式碼時的幾個壞習慣。有的習慣會讓 Bug 變得隱蔽難以追蹤,當然,也有的並沒有錯誤,只是個人覺得不夠優雅。 注意:示例程式碼在 Python 3.6 環境下編寫 1 用列表作函式的預設引數 看下面這個例子 正常我們