splice與slice實(shí)現(xiàn)數(shù)組的增刪改查
let arr = [1, 2, 3, 4];
console.log(arr.slice(1, 3)); //從第一個(gè)開(kāi)始截到3 得到的就是一個(gè)2 和 3 不會(huì)改變?cè)瓟?shù)組
console.log(arr.slice(0, 3)); //從0開(kāi)始截到3 得到的就是一個(gè)1 和 2 和 3 不會(huì)改變?cè)瓟?shù)組
console.log(arr.slice()); //如果不穿參數(shù) 得到的是整個(gè)數(shù)組
console.log(arr);
let arr = [1, 2, 3, 4];
// console.log(arr.splice(1, 2)); //從數(shù)組下標(biāo)1開(kāi)始 截取1后面2個(gè) 返回截取的數(shù)組[2, 3] 會(huì)改變?cè)瓟?shù)組
// console.log(arr); //[1, 4]
let hd = arr.splice(1, 2, '123'); //從數(shù)組下標(biāo)1開(kāi)始 截取1后面的2個(gè) 再?gòu)?后面增加一個(gè)123 會(huì)改變?cè)瓟?shù)組
// console.log(arr); //[1, '123', 4]
數(shù)據(jù)出棧與入棧及填充操作
let arr = [1, 2, 3];
// let hd = arr.pop(); //刪除最后一個(gè) 返回刪除的數(shù)字 改變?cè)瓟?shù)組
// let hd = arr.unshift(0); // 往數(shù)組前面增加一個(gè) 返回增加的數(shù)組 改變?cè)瓟?shù)組
// let hd = arr.shift(); //刪除數(shù)組中第一個(gè) 返回 刪除的值 改變?cè)瓟?shù)組
let hd = arr.push(0); //往數(shù)組后面增加一個(gè) 返回增加的數(shù)組 改變?cè)瓟?shù)組
解構(gòu)賦值 可以理解為把結(jié)構(gòu)里面的值批量賦值給變量
//數(shù)組解構(gòu)賦值
let arr = ['孫悟空', '豬八戒'];
let [swk, zbj] = arr;
console.log(swk); //孫悟空
console.log(zbj); //豬八戒
//對(duì)象解構(gòu)賦值
let obj = {name: '孫悟空', age: '1000'};
let {name, age} = obj;
console.log(name); //孫悟空
console.log(age); //1000
let [, arr] = ['name1', 'name2']
console.log(arr); //name2
let [arr, ...arrAll] = ['name1', 'name2', 'name3', 'name4']
console.log(arr); //name1
console.log(arrAll); //['name2', 'name3', 'name4'
展開(kāi)運(yùn)算符 展開(kāi)放在變量位置 是把內(nèi)容全部吸過(guò)來(lái) 放在值的位置 就表示 全部展開(kāi)
//一般拼接數(shù)組方法
let arr = [1, 2, 3];
let hd = [4, 5, 6];
for (let item of hd) {
arr.push(item);
}
console.log(arr); //[1, 2, 3, 4, 5, 6]
//展開(kāi)符拼接數(shù)組
let arr = [1, 2, 3];
let hd = [4, 5, 6];
arr = [...arr, ...hd];
console.log(arr); //[1, 2, 3, 4, 5, 6]
//函數(shù)展開(kāi)語(yǔ)法 當(dāng)函數(shù)參數(shù)不確定時(shí)候 可以用展開(kāi)語(yǔ)法接受參數(shù)
function show(...args) {
console.log(args); //[1, 2, 3, 4] 返回的是一個(gè)數(shù)組
}
console.log(show(1, 2, 3, 4));
數(shù)組的拆分與合并
let arr = '孫悟空, 豬八戒';
let hd = arr.split(','); //以逗號(hào)形式拆分 字符串 并返回一個(gè)數(shù)組;
console.log(hd); // ["孫悟空", " 豬八戒"]
console.log(hd.join(',')) //孫悟空, 豬八戒 （以逗號(hào)的形式 合并 返回字符串）
查找元素的基本操作
es5 之前查找元素 indexOf() 從左側(cè)查找數(shù)組 返回查找數(shù)組的索引值甩十，如果數(shù)組中不包含查找的數(shù)字 返回-1
let arr = [1, 2 , 3 , 2];
console.log(arr.indexOf(2)) // 1（返回arr數(shù)組中2的位置）
console.log(arr.indexOf(-2)) // -1 (數(shù)組中沒(méi)有-2這個(gè)值)
console.log(arr.indexOf(2, 2)) // 3 (參數(shù)1：查找2 參數(shù)2：從數(shù)組第二個(gè)開(kāi)始查找)
lastIndexOf（）從右側(cè)查找數(shù)組 返回查找數(shù)組的索引值菌湃，如果數(shù)組中不包含查找的數(shù)字 返回-1
let arr = [1, 2 , 4, 5, 3 , 2];
console.log(arr.lastIndexOf(2)) // 返回3 （因?yàn)閺挠覀?cè)開(kāi)始查找蜻展，輸入從右邊 要查找的 位置）
console.log(arr.lastIndexOf(2, 3)) // 1 （參數(shù)1：查找2 參數(shù)2：從數(shù)組最后一個(gè)數(shù)三位開(kāi)始查找 2)
一般開(kāi)發(fā)中要找數(shù)組中是否包含某個(gè)數(shù)
let arr = [1, 2 , 3];
if(arr.indexOf(2) !== -1){
console.log('找到了');
}
新版的es6中 有一個(gè)includes() 接受一個(gè)參數(shù)查找數(shù)組中是否有要查找的值 返回的是一個(gè)布爾值
let arr = [1, 2 , 3];
console.log(arr.includes(2)) //true
console.log(arr.includes(5)) //false
if(arr.includes(2)){
console.log('找到了');
}
高效的find與findIndex新增方法
// find 最主要的查找用法 查找引用類型 （引用類型比較 比較的是內(nèi)存地址 ）
let lessons = [{name: 'js'}, {name: 'php'}, {name: 'css'}];
let status = lessons.find(item => item.name == 'php'); //就進(jìn)查找 數(shù)組中是否有值 有的話 返回當(dāng)前值，沒(méi)有就返回undefined
let status1 = lessons.find(item => item.name == 'java'); //undefined
let index = lessons.findIndex(item => item.name == 'php'); //就進(jìn)查找 數(shù)組中是否有值 有的話 返回索引值暖途，沒(méi)有就返回undefined
console.log(status); //{name: "php"}
console.log(status1); // undefined
console.log(index); // 1
//自定義find寫(xiě)法
function find (array, callback) {
for (let item of array){
if (callback(item)) return item;
}
return undefined;
}
let arr = [1, 2, 3, 4];
console.log(find(arr, function (item) {
return item === 3
}));
sort排序
//sort排序
let arr = [10, 8, 6, 5, 2, 1];
arr = arr.sort(function (a, b) {
// -1 從小到大 1 正數(shù)從大到小
// 10 - 8 =
return a - b;
});
arr = arr.sort((a,b) => a - b);
console.log(arr);
//冒泡排序
// 1懈凹、比較相鄰的兩個(gè)元素，如果前一個(gè)比后一個(gè)大，則交換位置侧但。
// 2矢空、比較完第一輪的時(shí)候，最后一個(gè)元素是最大的元素俊犯。
// 3妇多、這時(shí)候最后一個(gè)元素是最大的，所以最后一個(gè)元素就不需要參與比較大小燕侠。
function sort(array) {
for (let n in array) {
for (let m in array){
let tep = [];
if (array[n] > array[m]){
tep = array[n];
array[n] = array[m]
array[m] = tep;
}
}
}
return array;
}
console.log(sort([1, 9, 8]));
數(shù)組循環(huán)操作
//循環(huán)操作中引用類型使用技巧
let arr = [{n: 1}, {n: 2}];
let arr1 = [1, 2, 3];
//for of 只能改變引用類型
for (let value of arr) {
value.n ++;
}
for (let value1 of arr1) {
value1 ++; // 不會(huì)改變值類型的數(shù)組
}
console.log(arr); // [{n: 2}, {n: 3}]
console.log(arr1); // [1, 2, 3]
forEach
let arr = [
{name : 'JavaScript'},
{name : 'PHP'},
{name : 'Python'}
]
arr.forEach((item, index, array) => {
//item 第一個(gè)參數(shù)是遍歷的數(shù)組內(nèi)容者祖，
// index 第二個(gè)參數(shù)是對(duì)應(yīng)的數(shù)組索引，
// array 第三個(gè)參數(shù)是數(shù)組本身
console.log(item, index, array);
})
every (返回一個(gè)布爾值)
const user = [
{name: '李四', js: 89},
{name: '張三', js: 99},
{name: '馬六', js: 55},
];
/**
* （every() 方法用于檢測(cè)數(shù)組所有元素是否都符合指定條件绢彤。一項(xiàng)不符合 就返回false七问，全部符合就返回true）
* item 是每一項(xiàng)的 數(shù)組
* index 數(shù)組索引值
* arr 原數(shù)組
* **/
const res = user.every((item, index, arr) => {
return item.js >= 60; //false
});
if (res) {
console.log('成績(jī)不合格')
} else {
console.log('成績(jī)?nèi)亢细?)
}
some (返回一個(gè)布爾值)
//some 當(dāng)一個(gè)為真 就返回真
const user = [
{name: '李四', js: 89},
{name: '張三', js: 99},
{name: '馬六', js: 55},
];
let res = user.some(item => {
return item.js > 60;
});
console.log(res); //true
filter (可以篩選出想要的值，返回一個(gè)數(shù)組)
let lessons = [{name: 'js'}, {name: 'php'}, {name: 'css'}];
//求出數(shù)組中包含的css項(xiàng)
let res = lessons.filter(item => {
return item.name === 'css'
});
console.log(res);
