前奏
約定JavaScript使用ES6标準開發
wxs(WeiXin Script)和JavaScript是不同的語言,有自己的文法,wxs請參考wxs文檔,這裡的規範僅針對js。
關鍵字
任何時候,避免使用語言保留關鍵字命名。
變量聲明
使用let代替var聲明變量,
let loadding = -1;
loadding = 0;
使用const聲明常量,常量名要求大寫,多個詞之間以下劃線_連接配接。
const { HOST, GET_URL } = require("../../utils/api.js");
js允許一個聲明可以有多個變量。我們約定,一個聲明隻有一個變量。
-
推薦寫法
let a = 0;
let b = 1;
let c = 2;
-
不推薦寫法
let a = 0, b = 1, c = 2;
字元串
字元串統一使用單引号\'\',不使用雙引号""
let title = \'中國火星探測器氣動設計已完成 正進行試驗驗證\';
字元串需要換行或由代碼生成的字元串時使用模闆字元串 ``
-
推薦寫法
// 字元串換行
let content =
;據了解,我國火星探測任務力争一次實作環繞、 着陸和巡視三大目标。其中,着陸器的着陸過程涉及到多項空 氣動力學難題。
// 代碼拼接生成字元串 let editor = \'付毅飛\'; let text = `責任編輯${editor}`;
-
不推薦寫法
// 字元串換行,使用 \n
let content = \'據了解,我國火星探測任務力争一次實作環繞、 \n 着陸和巡視三大目标。其中,着陸器的着陸過程涉及到多項空 \n氣動力學難題。\';
// 代碼拼接生成字元串 let editor = \'付毅飛\'; let text = \'責任編輯\' + editor;
函數
使用箭頭函數。箭頭函數不僅簡潔,還可以保留this指向
[1,2,3].map((item, index) => {
let res = item + index;
return res + 1;
});
函數隻有一個參數時,參數的()省略:
let show = a => {
alert(a*2);
}
函數體隻有一個return語句時,函數體的{}省略:
let show = (a,b) => a+b;
數組
使用字面量建立數組
let arr = [];
使用新方法forEach,map,filter,reduce處理數組資料,代碼書寫更簡潔
-
推薦寫法
// 取出數組裡的偶數
let arr = [1,2,3,4,5,6,7,8];
let result = arr.filter(item=>item%2===0)
// 輸出:[2, 4, 6, 8]
-
不推薦寫法
// 取出數組裡的偶數
let arr = [1,2,3,4,5,6,7,8];
let result = [];
for(let i=0; i<arr.length; i++) {
let item = arr[i];
if(item%2===0) {
result.push(item)
}
}
// 輸出:[2, 4, 6, 8]
使用解構指派和擴充運算符...簡化代碼
對象
使用字面量值建立函數
let obj = {};
屬性簡寫,屬性名跟值的變量(key和value)一樣時,隻寫屬性名
-
推薦寫法
let a = 5;
let obj = {
a,
b: 12
}
-
不推薦寫法
let a = 5;
let obj = {
a:a
b: 12
}
方法簡寫,不寫function和:
-
推薦寫法
let obj = {
a:13,
show(){
console.log(this.a);
}
}
-
不推薦寫法
let obj = {
a: 13,
show: function(){
console.log(this.a);
}
}
this
用到this轉換的地方,統一使用that
let that = this;