省的百度的小知識點(JS)

陸霸天發表於2018-06-21

1.apply | call | bind

其實就是:讓函式在某個指定的物件下執行,這個物件就是該函式的執行上下文;

Math.max.apply(null, [1,2,3,4]);  //4
foo.call(this,1,2,3); 
foo.bind(this)(1,2,3); //call和apply都是對函式的直接呼叫,而bind方法返回的仍然是一個函式
複製程式碼

2.字串方法

 str.indexOf(); //從左往右找,找不到時返回-1
 str.lastindexOf(); //從右往左找
 str.substring(index,index); //從下標開始擷取,原字串不改變
 str.slice(index,index);  //end下標前一位,原字串不改變,可以為負值
 str.includes(str1); 
 str.startsWith(str1);  
 str.endsWith(str1); 
複製程式碼

3.陣列

3.1 push | unshift | pop | shift

var arr = [1,2,3,4,5];
arr.push(6); //原陣列改變,返回值為陣列長度
arr.unshift(); //同上
==========================
arr.pop(); //原陣列改變,返回值為該刪除項(string)
arr.shift();//同上
複製程式碼

3.2 克隆陣列

const arr = [1,2,4];
const newarr = [...arr];
複製程式碼

3.3 slice| splice

//slice(index,index)
var arr = [1,2,3,4]
arr.slice(0,3);  //[1,2,3]  原陣列不改變
複製程式碼
//splece 原陣列發生改變,返回值為刪除的陣列
    刪除: arr.splice(index,count)
    插入: arr.splice(index, 0 , target)
    替換: arr.splice(index,1,target)
var arr = [1,2,3,4,5];
arr.splice(0,3); //[1,2,3]     arr為[4,5]
arr.splice(1,0,'insert'); //[]  arr為[4,insert,5]
arr.splice(1,1,'replace'); //['insert']  arr為[4, 'replace', 5]
 

複製程式碼

3.4 Array.of(): 將一組值轉化為陣列; Array.form(): 將偽陣列或可遍歷的物件轉化為陣列

Array.of(1,2,3); //[1,2,3]
Array.form({'0': 1, 'length': 1}) //[1]
複製程式碼

3.5 array.some | array.every

var arr = [1,2,4,5];
arr.some((item) => {
    return item > 4
}) //true
arr.every((item) =>  {
    return item >= 1
}) //true
複製程式碼

3.6 filter | map 原陣列都不變,返回新的陣列

//filter 
var arr = [                                         
     {"name":"apple", "count": 2},
     {"name":"orange", "count": 5},
     {"name":"pear", "count": 3},
     {"name":"orange", "count": 16},
];
arr.filter((item) => {
    return item.name == 'orange';
}) //[{"name":"orange", "count": 5},{"name":"orange", "count": 16}]
複製程式碼
//map
var oldArr = [
     {first_name:"Colin",last_name:"Toh"},
     {first_name:"Addy",last_name:"Osmani"},
     {first_name:"Yehuda",last_name:"Katz"}
];
oldArr.map((item) => {
    return {'name': item.first_name + item.last_name}
})//[{name: "ColinToh"},{name: "AddyOsmani"},{name: "YehudaKatz"}]
複製程式碼

3.7 find()| findIndex()
找出符合表示式的那一項 | 下標

//find
var arr = [{name: 'jack'}, {name: 'rose'}];
arr.find((item) => { return item.name == rose}).name = 'jack_love_rose';
arr//[{name: 'jack'}, {name: 'jack_love_rose'}]
//findIndex
arr.find((item) => { return item.name == 'jack_love_rose'}); //-1
複製程式碼

4.一些方法

4.1 Object.assign(target, source1, source2...); 淺拷貝,目標物件拷貝得到的是這個物件的引用; 
複製程式碼
var arr = {name: 'jack', age: ''};
var foo = {name: 'rose'};
var newarr = Object.assign(arr, foo); //{name: 'rose', age: ''};
複製程式碼
//
var arr =  {name: 'jack', age: ''};
var newarr = Object.assign({}, arr);
arr.age = 12;
newarr//{name: 'jack', age: 12}
複製程式碼

4.2 Object.prototype.toString.call();

精確判斷值型別
複製程式碼
var toString = Object.prototype.toString;
toString.call(new Date); // "[object Date]"
toString.call(new String); // "[object String]"
toString.call(Math); // "[object Math]"
toString.call(/s/); // "[object RegExp]"
toString.call([]); // "[object Array]"
toString.call(() =>{}) // "[object Function]"
//Since JavaScript 1.8.5
toString.call(undefined); // "[object Undefined]"
toString.call(null); // "[object Null]"
複製程式碼