2020-12-07 JavaScript知識點總結1：基本資料型別與引用資料型別,陣列方法,字串方法,陣列去重,獲取元素的6種方式,JSON 轉換,定時器,判斷資料型別,操作元素屬性,清除浮動
一．基本資料型別與引用資料型別
1.number:數字
2.string:字串
3.boolean:布林
4.undefined:未定義
5. null:空對像
6.object:物件 [ ]陣列，{ }
二．陣列方法
剪下連結合併序，判斷反轉刪除是，開頭結尾各兩個
1、剪下 slice
從陣列中返回指定的變數
2、連結 join
將陣列中的元素以分隔符連結，返回一個字串
預設的分隔符為逗號
3、合併 concat
合併陣列，返回新陣列，不會改變原陣列
4、序 sort 會改變原陣列
將陣列按從小到大（或從大到小）排列
5、判斷
從左到右查詢元素第一次在陣列中出現時的下標
如果有：顯示 出現時的下標
若沒有：顯示 -1
（2）、lastIndexOf
查詢元素在陣列中最後一次出現時的下標
如果有：顯示 出現時的下標
若沒有：顯示 -1
（3）、find
從左到右查詢陣列中指定的元素
如果符合條件 返回：元素
若不符合條件 返回：undefined
（4）、findIndex
從左到右查詢陣列中指定的元素的下標
如果符合條件 返回：元素下標
若不符合條件 返回：-1
（5）、includes
陣列中是否包含某個元素
如果包含 返回：true
若不包含 返回：false
6、反轉 reverse
反轉陣列，返回新陣列
7、刪除 splice 改變原陣列
刪除元素
新增元素
8、是 Array.isArray
判斷變數是不是陣列
如果是：返回 true
若不是：返回 false
9、開頭結尾各兩個
（1）、unshift
向陣列開頭新增元素 返回 陣列長度
（2）、shift
從陣列開頭刪除元素 返回 刪除的元素
（3）、push
向陣列末尾新增元素 返回 陣列長度
（4）、p0p
從陣列末尾刪除元素 返回 刪除的元素
10、其餘的
（1）、toString
轉為字串
null undefined 不能轉換
（2）、filter
將陣列中滿足條件的組成新陣列返回
若陣列中沒有一個滿足條件，則返回空陣列
（3）、map
（4）、Array.form
將偽陣列（類陣列）轉為陣列
三．字串方法
檢視判斷合併空，切割剪下轉大小
1、檢視
(1)、charAt 通過下標獲取字串中的某一項
(2)、charCodeAt 通過下標獲取字串中某一項的 Unicode編碼
(3)、String.fromCharCode 將 Unicode編碼 轉為對應的字元
2、判斷
(1)、indexOf 查詢元素在字串中 第一次 出現時的下標
如果有：顯示 下標
若沒有：顯示 -1
(2)、lastIndexOf 查詢元素在字串中 最後一次 出現時的下標
如果有：顯示 下標
若沒有：顯示 -1
(3)、includes 查詢字串中是否有某元素
如果有：顯示 true
若沒有：顯示 false
(4)、startsWith 字串開頭是否為某元素
如果有：顯示 true
若沒有：顯示 false
(5)、endsWith 字串結尾是否為某元素
如果有：顯示 true
若沒有：顯示 false
3、合併
concat 合併字串
4、空
trim 去掉字串前後的空格
5、切割
split 將字串切割為陣列
6、剪下
(1)、slice
從字串中返回指定的元素，既能用於陣列，也能用於字串
(2)、substring( )
從字串中返回指定的元素,只能用於字串，且括號內不能為負數
(3)、substr( 開始下標，擷取個數 )
擷取一定數量的元素
7、轉大小
(1)、toUpperCase 將英文字母轉為大寫
(2)、toLowerCase 將英文字母轉為小寫
四．陣列去重
//第一種去重方法
2. var arr=["a","b","c","d","a","c","b","d","f","s","g"];
3. var arr2=[];
4. for(var i=0;i<arr.length;i++){
5. if(arr2.indexOf(arr[i])==-1){
6. arr2.push(arr[i]);
7. }
8. }
9. Console.log(arr2)
//第二種去重方法
11. var a=["a","c","c","a","a","a","d","d"];
12. var a2=[];
13. for(var i=0;i<a.length;i++){
14. if(a2.lastIndexOf(a[i])==-1){
15. a2.push(a[i]);
16. }
17. }
18. console.log(a2);
//第三種去重方法
20. var c=["1","2","3","2","3","4","4"];
21. var c1=[];
22. for(var i=0;i<c.length;i++){
23. var c2=c1.findIndex(function(val){
24. return val==c[i];
25. })
26. if(c2==-1){
27. c1.push(c[i]);
28. }
29. }
30. console.log(c1);
31. //第四種去重方法
32. var d=["1","2","3","2","3","4","4"];
33. var d1=Array.from(new Set(d));
34. console.log(d1);
35.
五．獲取元素的6種方式
1.document.getElementsByClassName(class);
2.document.getElementsByTagName(標籤名);
3.document.getElementsByName(name屬性);
4.document.querySelector(css選擇器);
5.document.querySelectorAll(css選擇器);
6.document.getElementById(id);
六．JSON 轉換字串物件的方法與轉換成陣列物件的方法
-
JSON 字串 轉為 JSON 物件
console.log( JSON.parse(jsonStr) ); -
JSON物件 轉為 JSON 字串
console.log( JSON.stringify(jsonObj) );
七．間歇定時器與超時定時器以及他們對應的清除定時器的方法
1.setInterval( 函式，時間毫秒 ) 無限次
2.setTimeout(函式，時間毫秒) 一次性
3.clearInterval() 清楚無限次
4.clearTimeout() 清除一次性
八．JS判斷資料型別的方法
1
. // 第一種函式封裝檢查資料型別。
function a(b){
var type=Object.prototype.toString.call(b);
type=type.substr(8,type.length-9);
return type;
}
var x=a("");
console.log(x);
//第二種方法判斷資料型別。
console.log(Object.prototype.toString.call(""));
var x=Object.prototype.toString.call("");
var s=x.substr(8,x.length-9);
console.log(s);
//第三種方法 typeof 檢查資料型別
console.log(typeof 1);
console.log(typeof "");
// 第四種方法 instanceof
console.log([1,1] instanceof Array);
console.log( "ssss" instanceof String);
function a(c){
var d=Object.prototype.toString.call(c);
s=d.substr(8,d.length-9);
return s;
}
var v=a(0)
console.log(v);
九．操作元素屬性
節點物件.attributes 獲取所有屬性 組成偽陣列
節點物件.屬性名
節點物件.getAttribute(屬性名);
節點物件.setAttribute(屬性名,新的屬性值);
節點物件.removeAttribute(屬性名);
十．怎麼清除浮動
1.使用空標籤清除浮動 clear:both（理論上能清除任何標籤，增加無意義的標籤）
2.給元素父級設定overflow：hidden;
3.父級設定高度
4.是用afert偽元素清除浮動(用於非IE瀏覽器) after