記錄自己在工作中,時不時使用,每次都要去查一下的基礎方法。以及ES6經常使用的方法 一、Array 1、concat 合併數組 2、shift 獲取數組第一個元素 unshift 向數組首位添加一個元素 3、pop 獲取數組中最後一個元素 4、slice 截取數組 5、splice 對數組的增刪改 ...
記錄自己在工作中,時不時使用,每次都要去查一下的基礎方法。以及ES6經常使用的方法
一、Array
1、concat 合併數組
2、shift 獲取數組第一個元素 unshift 向數組首位添加一個元素
3、pop 獲取數組中最後一個元素
4、slice 截取數組
5、splice 對數組的增刪改
/* * concat 合併數組 * 該方法並不會改變原有的數組結構,而是生成一個新的數組 * */ var arr1_1 = [1 , 2 , 3] , arr1_2 = [4 , 5]; var arr1_3 = arr1_1.concat(arr1_2); console.log(arr1_1 , arr1_2 , arr1_3);//(3) [1, 2, 3] (2) [4, 5] (5) [1, 2, 3, 4, 5] console.log('---------------------------------------------------------'); /* * shift 獲取數組中的第一個元素 * unshift 向數組第一項添加一個元素 * 該方法會把數組第一個元素給刪除 * */ var arr2_1 = [1 , 2, 3 , 4]; var item2 = arr2_1.shift(); console.log(arr2_1 , item2);//(3) [2, 3, 4] 1 console.log(arr2_1.unshift(1));//(4) [1 ,2, 3, 4] console.log('---------------------------------------------------------'); /* * pop 獲取數組中最後一個元素 * 該方法會把數組最後一個元素給刪除 * */ var arr3_1 = [1 , 2, 3 , 4]; var item3 = arr3_1.pop(); console.log(arr3_1 , item3);//(3) [1, 2, 3] 4 console.log('---------------------------------------------------------'); /* * slice 截取數組 * 該方法不會改變原有數組的結構,兩個參數為[)左閉右開的區間,兩個參數均代表index索引 * */ var arr4_1 = [1 , 2, 3 , 4]; var arr4_2 = arr4_1.slice(1 , 3); console.log(arr4_1 , arr4_2);//(4) [1, 2, 3, 4] (2) [2, 3] console.log('---------------------------------------------------------'); /* * splice * 數組方法中最強大的,包含數組操作的增刪改 * 它會修改原有的數組結構,並返回一個新數組 * 可以傳入多個參數splice(index , length , args) * index 開始的索引 length 刪除元素的長度 args 向索引處添加的元素(可以為多個) * */ var arr5_1 = [1 , 2, 3 , 4 , 5]; //1、刪除 var arr5_2 = arr5_1.splice(1 , 2); console.log(arr5_1 , arr5_2);//(3) [1, 4, 5] (2) [2, 3] //2、新增 var arr5_3 = [1 , 2, 3 , 4 , 5]; var arr5_4 = arr5_3.splice(1 , 0 , 9 , 8); console.log(arr5_3 , arr5_4);//(7) [1, 9, 8, 2, 3, 4, 5] [] //3、修改 var arr5_5 = [1 , 2, 3 , 4 , 5]; var arr5_6 = arr5_5.splice(1 , 2 , 9 , 8); console.log(arr5_5 , arr5_6);//(5) [1, 9, 8, 4, 5] (2) [2, 3]
二、String
1、concat 拼接字元串
2、slice 字元串截取
3、substring 字元串截取
4、substr 字元串截取
/* * concat 拼接字元串 * */ var str1_1 = 'sky '; console.log(str1_1.concat('blue'));//sky blue console.log('---------------------------------------------------------'); /* * slice 字元串截取 * 使用方法同數組一樣 * */ var str2_1 = 'sky blue'; var str2_2 = str2_1.slice(1 , 5); console.log(str2_1 , str2_2);//sky blue ky b console.log('---------------------------------------------------------'); /* * substring 字元串截取 * 使用方法同slice一樣 * */ var str3_1 = 'sky blue'; var str3_2 = str3_1.substring(1 , 5); console.log(str3_1 , str3_2);//sky blue ky b console.log('---------------------------------------------------------'); /* * substr 字元串截取 * 同樣是接收2個參數,一個是開始截取的索引位置,一個是要截取的長度 * */ var str4_1 = 'sky blue'; var str4_2 = str4_1.substr(1 , 4); console.log(str4_1 , str4_2);//sky blue ky b console.log('---------------------------------------------------------');
三、ES6在處理對象和數組中常用方式
1、數組過濾
2、數組添加元素
3、對象添加
4、對象覆蓋
5、獲取對象中的值
/* * filter 數組過濾 * 該方法會返回一個新數組 * */ const arr1_1 = [1 , 2 ,3 ,4 ,5]; let arr1_2 = arr1_1.filter(item => item != 3); console.log(arr1_2);//(4) [1, 2, 4, 5] console.log('---------------------------------------------------------'); /* * 數組添加元素 * 得到的是一個新數組 * */ const arr2_1 = [1 , 2]; let arr2_2 = [...arr2_1 , 3 , 4]; console.log(arr2_2);//(4) [1, 2, 4, 5] console.log('---------------------------------------------------------'); /* * 對象添加 * 得到一個新對象 * */ const obj3_1 = {a : 1 , b : 2} , c = 3; let obj3_2 = {...obj3_1 , c }; console.log(obj3_2);//{a: 1, b: 2, c: 3} console.log('---------------------------------------------------------'); /* * 對象覆蓋 * 覆蓋目標對象 * */ let obj4_1 = {a : 1 , b : 2} , obj4_2 = {a : 11 , b : 22} , obj4_3 = {c : 3}; Object.assign(obj4_1 , obj4_2 , obj4_3); console.log(obj4_1);//{a: 11, b: 22, c: 3} console.log('---------------------------------------------------------'); /* * 獲取對象中的值 * */ const obj5_1 = {a5 : 1 , b5 : 2 , c5 : 3}; let {a5 , b5 , c5 } = obj5_1; console.log(a5 , b5 , c5);//1 2 3
搞定!!!