js基本語法彙總
阿新 • • 發佈:2018-11-09
注意 轉載須保留原文連結(http://www.cnblogs.com/wzhiq896/p/6783296.html ) 作者:wangwen896 整理
1、分類
ECMAScript js基本語法與標準
DOM Document Object Model文件物件模型
BOM Browser Object Model瀏覽器物件模型
tips:DOM和BOM都是一套API(Application programing interface)
2、註釋方式
style /* */ body <!-- --!> script // /* */ /** * js說明文件註釋 */
3、簡單指令
alert(""); 提示框;
confirm(""); 確認框,點選後會響應返回true或false;
prompt(); 彈出一個輸入框;
document.write("");
console.log(""); 在控制檯列印相應的資訊;
console.dir(""); 在控制檯打印出該物件的所有資訊;
4、變數命名
數字(0-9)、字母(a-z,A-Z)、下劃線(_);
tips:應避免保留字和關鍵字;
5、NaN和isNaN
isNaN(number),如果number不是數字,則為true; Number(number),在轉換為數字型別時,若number不是數字,則返回NaN;
6、轉義字元
\
\r 回車
\n 空格
\t 縮排
\\ 反斜槓
7、邏輯短路、邏輯中斷
true || 6; 邏輯或短路,左邊為ture返回右值;
6 && true; 邏輯與短路,左邊false返回右值;
8、優先順序
* / %
+ -
&&
||
?
tips:自上而下優先順序越來越高
9、型別轉換(type)
parseInt("12a3"); 轉為數字,嘗試強轉; parseFloat("123.123"); data.toString(); String(data); tips:變數宣告未賦值,其值為undefined; 物件為空,其值為null;
10、三元表示式
eg : a>b?a=1:a=2;
格式:
判斷條件?true的時候執行的操作:false的時候執行的操作;
11、陣列Array
(1)、定義法
建構函式:
var arr = new Array("123","abc","xxx");
字面量:
var arr = ["123","646","abc"];
陣列長度:
var arr = new Array(6);(陣列長度為6);
(2)、賦值
arr[0]=1;
12、形參和實參
定義函式時,function funcA(a,b,c){},其中的a、b、c即為形參;
呼叫函式時,funcA(1,2,3);其中的1、2、3即為實參;
tips:function裡面有一個arguments物件,裡面存有所有傳進函式的實參;
13、函式function
(1)、函式命名
1、 可以使用字元、數字、下劃線、$;
2、 不能以數字開頭;
3、 不能使用關鍵字和保留字;
4、 區分大小寫;
5、 建議要有意義 -- 動詞+名字結構;
6、 駝峰命名法;
7、 函式名不能重名,後面寫的重名函式會把前面寫的函式給覆蓋掉;
(2)、函式的返回值
返回值:
當函式執行完畢之後,所得到的結果就是一個函式返回值
任意函式都有返回值
1、 在函式內部沒有顯示的寫有return的時候,函式的返回值是undefined;
2、 當函式內部有return,但是return後面沒有跟著任何內容或者資料的時候,
函式的返回值是undefined,並且return後面的程式碼不會執行;
3、 當return後面跟著內容或者資料的時候,函式的返回值就是這個跟著的內容或者資料;
(3)、函式的四種形式:
1、沒有引數,沒有return;
通常在於封裝一段過程;
2、沒有引數,有return;
通常用於內部封裝引用其他函式(閉包,回撥);
3、有引數,沒有return;
通常用於執行操作的封裝;
4、有引數,有return;
常見形式;
(4)、匿名函式
匿名函式的name屬性值為anonymous;
函式僅用一次的情況,即用即廢;
eg:
setTimeout(function(){
console.log(this.name);
},1000);
tips:在1秒後在控制檯打印出本函式的名稱;
(5)、回撥函式
在一個函式當中,另一個函式作為引數傳入該函式中,另一個的這個函式即為回撥函式;
eg:
function atack(callback){
return callback;
}
tips:在呼叫該函式時,指定callback是哪個函式;
atack(func);
(6)、短路運算
作用:防止傳入函式的資料不足,造成無法執行;
eg:
function getResult(a,b,fn) {
fn && fn();
}(通常使用邏輯與的短路來決定是否執行回撥函式;)
function getResult_2(a,b){
a || 0;
}(通常用邏輯或的短路來防止實參不足的情況,強行賦值;)
(7)、自執行函式
(function func2(){
})()
tips:在函式定義的結束最後寫入一個(),該函式定義完成後直接被呼叫執行;
(8)、遞迴
在函式執行的最後再一次的呼叫自身;
tips:遞迴是一種非常耗資源的做法,通常為了簡化運算,還會結合快取進行;
並且注意,遞迴必須要有結束判斷條件(if),否則該函式被呼叫後就是死迴圈;
14、資料型別
(1)、簡單資料型別
string、number、boolean
(2)、複雜資料型別
String、Number、Boolean、Array、Math、Date、Obeject、function、RegExp(正則表示式)
(3)、空資料型別
* Null ---→Null的資料型別會返回一個Object
* undifined
tips:用typeof可以進行判斷資料型別;
tips:定義的簡單資料型別變數,其資料儲存在變數中;
而複雜資料型別,其變數儲存的是資料所在的記憶體地址;
15、內建物件
Array、Date、Math、String;
16、(Math)數學物件
向上取整 Math.ceil(number);
向下取整 Math.floor(number);
四捨五入 Math.round(number);
求多個數字之間的最大值 Math.max();
求多個數字之間的最小值 Math.min();
求x的y次冪 Math.pow(x,y);
求正弦值 Math.sin(x);
example:
求一個角度的正弦值,要求x必須是一個額弧度值
角度和弧度的轉換公式:
弧度 = 角度 * 2 * Math.PI / 360;
Math.sin(30*2*Math.PI/360)
Math.abs(x); 得到一個數字的絕對值
17、(Array)陣列物件
(1)、arr1.concat(arr2);
陣列拼接,結果為將arr2拼接到arr1的最後;
(2)、arr.join();
陣列字串輸出,括號內可以指定元素連線的符號;
eg:
arr=["a","b","c","d"];
console.log(arr.join("|")); (結果為"a|b|c|d")
(3)、arr.pop();
切除陣列的最後一個元素,返回值為該元素;
(4)、arr.slice(start,end)
獲取,獲取陣列的指定片段,start必須有,如果引數為負數則從末尾開始選取;
返回值為該片段組成的,一個新的陣列;
(5)、arr.push
新增,用於向陣列的末尾新增新的元素,引數可以是多個;
返回值為陣列的新長度;
(6)、arr.splice
1、用於向陣列中指定的索引新增元素;
arr.splice(2, 0, "William","asdfasdf");
在第2個元素開始,刪除的元素個數(可以為0,為0到結尾),
加入元素為"William"、"asdfasdf";
2、用於替換陣列中的元素;
arr.splice(2,1,"William");
3、用於刪除陣列中的元素;
arr.splice(2,2);
(7)、arr.indexOf(element);
查詢,在陣列中查詢element,返回值為索引,如果沒有該元素返回-1;
(8)、arr.sort(function);
排序,function為一個函式;
eg:
function sortNumber(a,b){
return a-b;
}
arr.sort(sortNumber);(從小到大排序)
tips:如果a-b改成b-a,那麼執行的操作為從大到小;
tips:字串物件(String)的方法與Array的方法類似;
18、(Date)日期物件
date.getTime()
date.getMilliseconds()
date.getSeconds()
date.getMinutes()
date.getHours()
date.getDay()
date.getDate()
date.getMonth()
date.getFullYear()
tips:很多,查文件
19、(String)物件
charAt(index)
str[index] 獲取字串指定位置的字元
concat() 拼接字串
---------------------------
slice(start,end)/
substring(start,end) 擷取從start開始,end結束的字元,
返回一個新的字串,若start為負數,那麼從最後一個字元開始;
substr(start,length) 擷取從start開始,length長度的字元,得到一個新的的字串
---------------------------
indexOf(char) 獲取指定字元第一次在字串中的位置
lastIndexOf(char) 獲取指定字元最後一次出現在字串中的位置
trim() 去除字串前後的空白
---------------------------
toUpperCase()
toLocaleUpperCase() 轉換為大寫
toLowerCase()
toLocaleLowerCawse() 轉換為小寫
---------------------------
replace() 替換字元
split() 分割字串為陣列
20、自定義物件
物件:無序屬性的集合;
特徵:屬性(key);
行為:方法(value);
js是基於物件的弱型別語言;
繼承:基於類,子類可以從父類得到的特徵;
工廠模式:定義一個function建構函式,作為物件,要建立物件直接呼叫該建構函式,加new關鍵字;
建構函式:定義物件的函式,裡面存有該物件擁有的基本屬性和方法;
命名首字母大寫,this會自動指代當前物件;
訪問物件屬性:
obj[key];
obj.key;
遍歷物件:
for(key in obj){
key 為屬性名;
obj[key] 為屬性值(value);
}
21、JSON
{
"name" : "李狗蛋",
"age" : 18,
"color" : "yellow"
}
1、 所有的屬性名,必須使用雙引號包起來;
2、 字面量側重的描述物件,JSON側重於資料傳輸;
3、 JSON不支援undefined;
4、 JSON不是物件,從伺服器發來的json一般是字串,
通過JSON.parse(jsonDate.json)可以將其轉換成js物件;
22、JS解析
(1)、作用域
全域性作用域:整個程式碼所有地方都可以呼叫;
區域性作用域:在函式內部宣告的變數,只可以在函式內部使用;
(2)、變數提升和函式提升
預解析:在解析的時候,var和function都會被提升到程式碼的最頂端;
但是賦值操作不會被提升,定義和函式才會被提升;
if裡面的變數定義也會被提升,但是賦值操作不會;
23、其他細節(tips)
(1)、元素由物件組成的陣列進行排序
eg:
var data = [
{title: "老司機", count: 20},
{title: "詩人", count: 5},
{title: "歌手", count: 10},
{title: "隔壁老王", count: 30},
{title: "水手", count: 7},
{title: "葫蘆娃", count: 6},
];
//該陣列的元素都為物件。我們需求為根據count的值給陣列重新排序。
//解決方案:使用sort方法,對傳入的函式做手腳。
function sortArr(a,b){
return a.count > b.count;
}
data.sort(sortArr);
//原本的a和b的比較方法變成a.count和b.count;
//原本的比較方法可以參見17,陣列物件
//至此,data將以count值從小到大排列。
tips:Array物件的sort方法傳入的為比較函式,比較函式裡return排序比較的方法;
原始的sort方法傳入的函式內部return的值為a>b,
通過修改sort傳入的函式,可以實現對元素為物件的陣列的排序!