JavaScript書寫格式
JavaScript 有三種書寫格式, 分別是行內(nèi)式、內(nèi)嵌式、外鏈?zhǔn)健?推薦使用外鏈?zhǔn)? 遵守結(jié)構(gòu)、樣式、行為分離。
- 行內(nèi)式格式(不推薦)
<button onclick="alert('行內(nèi)式格式');">點(diǎn)我一下</button>
- 內(nèi)嵌式格式
</body>
... ...
<script type="text/javascript">
alert('內(nèi)嵌式格式-body');
</script>
</body>
注意:
1）通常將js代碼放在body的最后， 因?yàn)镠TML是從上至下加載，而js代碼通常是給標(biāo)簽添加交互(操作元素)，所以需要先加載HTML，否則如果執(zhí)行js代碼時(shí)HTML還未被加載，js代碼將無法添加交互(操作元素);
2）HTML頁面中出現(xiàn)<script>標(biāo)簽后，就會讓頁面暫停等待腳本的解析和執(zhí)行。無論當(dāng)前腳本是內(nèi)嵌式還是外鏈?zhǔn)?，頁面的下載和渲染都必須停下來等待腳本的執(zhí)行完成才能繼續(xù)；
3）如果將 js 代碼放在 head 標(biāo)簽中, 為了保證執(zhí)行js代碼時(shí)HTML一定已經(jīng)被加載了，那么需要添加一些額外代碼。(不推薦)
<head>
<script>
window.onload = function () { // 必須添加這句
alert("內(nèi)嵌式格式-head");
}
</script>
</head>
- 外鏈?zhǔn)礁袷?/li>
<script type="text/javascript" src="helloWorld.js"></script>
注：外鏈?zhǔn)降膕cript代碼塊中不能編寫js代碼, 即便寫了也不會執(zhí)行。
常見輸出方式
- 在瀏覽器彈窗中顯示內(nèi)容
alert("alert 彈窗");
prompt("prompt 請輸入內(nèi)容："); // prompt()函數(shù)返回值為String
confirm("confirm 請確認(rèn)");
- 在頁面中顯示內(nèi)容
document.write("網(wǎng)頁中打印文字");
- 在控制臺中顯示內(nèi)容
console.log("控制臺輸出文字");
console.error("錯誤信息");
console.warn("警告信息");
注意：JS中嚴(yán)格區(qū)分大小寫。
注釋
- 單行注釋
cmd + / - 多行注釋
cmd + opt + /
常量
常量表示一些固定的數(shù)據(jù)，也就是不能改變的數(shù)據(jù)。
-
常量分類
整型常量：123
實(shí)型常量：3.14
字符串常量: 'abc'、"abc"
布爾值：true或false
特殊字符：(例如：\n 換行)
變量
變量表示一些可以變化的數(shù)據(jù)。
定義變量(聲明變量)，任何變量在使用之前，必須先進(jìn)行定義；
定義變量的目：在內(nèi)存中分配一塊存儲空間給變量，方便以后存儲數(shù)據(jù)。
如果定義了多個(gè)變量，就會為這多個(gè)變量分別分配不同的存儲空間。
- 變量的初始化
變量第一次賦值，可以稱為“初始化”。
注：如果變量沒有初始化, 里面存儲的是undefined。
// 先定義，后初始化
var num;
num = 10;
// 定義的同時(shí)進(jìn)行初始化
var num = 10;
// 部分初始化
var a, b, c = 10;
// 完全初始化
var a , b, c;
a = b = c = 10;
// 可以將一個(gè)變量的值賦值給另一個(gè)變量
var a = 10;
var b = a;
console.log(b); // 10
標(biāo)識符（變量名）
- 命名規(guī)范
1）變量的名稱可以包含數(shù)字、字母、"_"、$，不能以數(shù)字開頭；
2）變量的名稱要有意義(有利于提高閱讀性)；
3）遵守駝峰命名法，首字母小寫，第二個(gè)單詞的首字母大寫；
例如: userName、myFirstName
注：標(biāo)志符js底層采用Unicode編碼存儲，所以標(biāo)志符可以是中文，但不要這么用。
const的使用
主要作用是將某個(gè)變量修飾為常量，不可再次賦值;
當(dāng)我們修飾的標(biāo)識符不會被再次賦值時(shí)，就可以使用const來保證數(shù)據(jù)的安全性;
ES6開發(fā)中，優(yōu)先使用const,只有需要改變某一個(gè)標(biāo)識符時(shí)，才使用let;
/*
1. 注意點(diǎn)一：const修飾的標(biāo)識符不能再次賦值
// const a = 20;
// a = 30；
2. 注意點(diǎn)二：const修飾的標(biāo)識符必須賦值
// const name;
3. 注意點(diǎn)三：常量的含義是指向的對象不能修改，但是可以改變對象內(nèi)部屬性
const obj = {
'name': 'xiaolan',
'age': 13
}
obj.age = 15
*/
對象的增強(qiáng)寫法
<script>
const name = 'xiaolan';
const age = 17;
// ES5對象寫法
const obj1 = {
name: name,
age: age,
run: function () {
console.log('run')
}
}
console.log(obj1)
// ES6對象寫法
const obj2 = {
name,
age,
run() {
console.log('run')
}
}
console.log(obj2)
</script>
