JavaScript語法約定和程序調(diào)試原理解析
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、運算符周圍的空格
在運算符( = + - * / )周圍以及逗號之后添加空格,如下:
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 語法約定的特點:
- 善代碼可讀性
- 提升代碼可維護(hù)性
JavaScript 程序調(diào)試
1、打開瀏覽器,按F12進(jìn)入調(diào)試界面:
Elements:用于查看和編輯當(dāng)前頁面中的HTML和CSS元素。
Console:用于顯示腳本中所輸出的調(diào)試信息,或運行測試腳本等。
Sources:用于查看和調(diào)試當(dāng)前頁面所加載的腳本的源文件。在source目錄下進(jìn)行調(diào)試。在該模式下,點擊js里每一行即可以加斷點。
斷點調(diào)試細(xì)節(jié)后續(xù)講到!?。?/p>
- 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í)行,必須點擊 '確定' 按鈕才能繼續(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()行為可能會有所不同。
以上僅是個人見解,若有不足之處歡迎在下方評論指出,那就先分享到這里!! 😄 后續(xù)繼續(xù)更新!!
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- 溫習(xí)Javascript基礎(chǔ)語法之詞法結(jié)構(gòu)
- javascript中正則表達(dá)式語法詳解
- javascript 高級語法之繼承的基本使用方法示例
- 詳解JavaScript 新語法之Class 的私有屬性與私有方法
- JSON基本語法及與JavaScript的異同實例分析
- NodeJS模塊與ES6模塊系統(tǒng)語法及注意點詳解
- JavaScript ES6中的簡寫語法總結(jié)與使用技巧
- js es6系列教程 - 新的類語法實戰(zhàn)選項卡(詳解)
- 關(guān)于javascript事件響應(yīng)的基礎(chǔ)語法總結(jié)(必看篇)
- 深入理解JavaScript中的語法和代碼結(jié)構(gòu)
相關(guān)文章
GWT中復(fù)制到剪貼板 js+flash實現(xiàn)復(fù)制 兼容性比較好
今天看到有個Google Code的項目,叫ZeroClipboard,大意是使用flash作為媒介,將內(nèi)容復(fù)制到剪貼板。這比用純javascript好,因為不同瀏覽器會出于安全的原因,有不同反應(yīng),例如IE會給出提示,有的瀏覽器不支持復(fù)制到剪貼板。2010-03-03spirngmvc js傳遞復(fù)雜json參數(shù)到controller的實例
下面小編就為大家分享一篇spirngmvc js傳遞復(fù)雜json參數(shù)到controller的實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03學(xué)習(xí)JSON.stringify的9大特性和轉(zhuǎn)換規(guī)則
本文介紹JSON.stringify9大特性和轉(zhuǎn)換規(guī)則,JSON.stringify()方法將一個JavaScript對象或值轉(zhuǎn)換為?JSON?字符串,如果指定了一個replacer?函數(shù),則可以選擇性地替換值,或者指定的replacer是數(shù)組,則可選擇性地僅包含數(shù)組指定的屬性,更多內(nèi)容需要的小火煸可以參考下面溫行內(nèi)容2022-02-02JS實現(xiàn)查找數(shù)組中對象的屬性值是否存在示例
這篇文章主要介紹了JS實現(xiàn)查找數(shù)組中對象的屬性值是否存在,涉及javascript針對json數(shù)組的遍歷、查找相關(guān)操作技巧,需要的朋友可以參考下2019-05-05javascript 實現(xiàn)頁面加載進(jìn)度條代碼
javascript 實現(xiàn)頁面加載進(jìn)度條代碼,需要的朋友可以參考下。2010-04-04