深入淺析js中程序調(diào)試和語法約定的原理

深入淺析js中程序調(diào)試和語法約定的原理？相信很多沒有經(jīng)驗的人對此束手無策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個問題。

JavaScript 語法約定

1、大小寫的區(qū)分

1). JavaScript的關(guān)鍵字，永遠(yuǎn)都是小寫的；

2). 內(nèi)置對象，如Math和Date是以大寫字母開頭的；

3). 對象的名稱通常是小寫；若是多個單詞，駝峰（Camel）命名法。

駝峰（Camel）命名法：開頭單詞小寫，后面單詞首字母大寫。使用的很普遍，很多人習(xí)慣這種命名方法。示例：userName。

2、變量、對象和函數(shù)的名稱命名

當(dāng)聲明變量、對象和函數(shù)的名稱時大小寫，數(shù)字，下劃線，美元符號都可以，但是必須以字母，下劃線，美元符號開頭。否者會出現(xiàn)Uncaught SyntaxError類型的錯誤提示。

3、分號 ";"

JavaScript允許開發(fā)者自行決定是否以分號結(jié)束一行代碼。
如果沒有分號，JavaScript就將行代碼的結(jié)尾看作該語句的結(jié)尾，不會報錯。但最好每寫完一行代碼就加上";" 作為結(jié)尾。

4、運(yùn)算符周圍的空格

在運(yùn)算符（ = + - * / ）周圍以及逗號之后添加空格，如下：

var a = 2 + 5;var arr = ["a", "b", "c"];

5、代碼縮進(jìn)

使用對代碼塊縮進(jìn)使用 4 個空格，使代碼塊更加清晰。如以下格式：

function isFunny(){
  var isTrue=true;
	if(isTrue){
		console.log("你是對的");
	}
}

JavaScript 語法約定的特點(diǎn)：

• 善代碼可讀性
• 提升代碼可維護(hù)性

JavaScript 程序調(diào)試

1、打開瀏覽器，按F12進(jìn)入調(diào)試界面：

Elements：用于查看和編輯當(dāng)前頁面中的HTML和CSS元素。

Console：用于顯示腳本中所輸出的調(diào)試信息，或運(yùn)行測試腳本等。

Sources：用于查看和調(diào)試當(dāng)前頁面所加載的腳本的源文件。在source目錄下進(jìn)行調(diào)試。在該模式下，點(diǎn)擊js里每一行即可以加斷點(diǎn)。

斷點(diǎn)調(diào)試細(xì)節(jié)后續(xù)講到?。?！

• Network：用于查看HTTP請求的詳細(xì)信息，如請求，響應(yīng)及返回內(nèi)容等。
• Timeline：用于查看腳本的執(zhí)行時間，頁面元素渲染時間等信息。
• Profiles：用于查看CPU執(zhí)行時間與內(nèi)存占用等信息。
• Resource：用于查看當(dāng)前頁面所請求的資源文件，如HTML，CSS樣式等。
• Audits: 用于優(yōu)化前端頁面，加速網(wǎng)頁加載速度等。

2、用alert，每次都彈框判斷出錯的位置

alert() 會阻塞 UI 和 alert() 以下的 javascript 代碼的執(zhí)行，必須點(diǎn)擊 '確定' 按鈕才能繼續(xù)，非常低效。當(dāng)使用 alert() 進(jìn)行彈出時，最后產(chǎn)品上線后，會降低用戶體驗。

3、用console.log，這個數(shù)據(jù)量小還可以，調(diào)試時console.log是最常用的命令之一。

console.log()可以接受任何字符串、數(shù)字和JavaScript對象。與alert()函數(shù)類似，console.log()也可以接受換行符\n以及制表符\t。console.log()語句所打印的調(diào)試信息可以在瀏覽器的調(diào)試控制臺中看到。不同的瀏覽器中console.log()行為可能會有所不同。

看完上述內(nèi)容，你們掌握深入淺析js中程序調(diào)試和語法約定的原理的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！