1.push()和pop()
数组尾部操作方法
push():方法可向数组的末尾添加一个或多个元素,并返回新的长度。
pop():方法用于删除并返回数组的最后一个元素。
代码演示:
<script>
let arr = [1, 2, 3, 4];
//push
let newArr1 = arr.push(5, 'last');
console.log(arr); //[1,2,3,4,5,'last'];
console.log(newArr1); // 6
//pop
let newArr2 = arr.pop();
console.log(arr); //[1,2,3,4,"5"];
console.log(newArr2); // last
</script>
2.shift() 和 unshift()
数组头部操作方法
shift():方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。
unshift():方法可向数组的开头添加一个或更多元素,并返回新的长度。
代码演示:
<script>
let arr = [1, 2, 3, 4];
//shift
let newArr1 = arr.shift();
console.log(arr); // [2, 3, 4]
console.log(newArr1); // 1
//unshift
let newArr2 = arr.unshift("first");
console.log(arr); // ["first", 2, 3, 4]
console.log(newArr2); // 4
</script>
3.splice(index , howmany , item1,.....,itemX)
功能比较多,该方法会改变原始数组
splice() 方法可以用来新增,删除,更改数组,返回被删除的项目
index:必需。整数,规定添加/删除项目的索引值,使用负数可从数组结尾处规定位置。
howmany:必需。要删除的项目数量。如果设置为 0,则不会删除项目。
item1, ..., itemX:可选。向数组添加的新项目。
代码演示:
<script>
let arr = ["张三", "李四", "王五", "赵六", "周七"];
/**************删除"李四"****************/
let newArr1 = arr.splice(1, 1); // 下标从1开始,删除1个(李四)
console.log(newArr1); // ["李四"]
console.log(arr); // ["张三", "王五", "赵六", "周七"] (原数组改变)
//删除多个
let newArr2 = arr.splice(1, 2);
console.log(newArr2); // ["王五", "赵六"]
console.log(arr); // ["张三", "周七"]
/**************添加"新一"****************/
let newArr3 = arr.splice(1, 0, "新一");
console.log(newArr3); // [] (没有删除元素,所以返回的是空数组)
console.log(arr); // ["张三", "新一", "周七"]
//添加多个
let newArr4 = arr.splice(3, 0, "新二", "新三", "新四");
console.log(newArr4); // []
console.log(arr); // ["张三", "新一", "周七", "新二", "新三", "新四"]
/**************"新五"替换"张三"****************/
let arrReplace5 = arr.splice(0, 1, "新五");
console.log(arrReplace5); // ["张三"]
console.log(arr); // ["新五", "新一", "周七", "新二", "新三", "新四"]
//替换多个
let arrReplace6 = arr.splice(2, 3, "替换");
console.log(arrReplace6); // ["周七", "新二", "新三"]
console.log(arr); // ["新五", "新一", "替换", "新四"]
</script>
仔细观看代码,寻找其中规律
4.join()
数组转字符串,方法只接收一个参数:即默认为逗号分隔符()。
一个数组使用次方法,不会改变原来的数组
<script>
let arr = [1, 2, 3, 4];
console.log(arr.join()); //1,2,3,4
console.log(arr.join(":")); //1:2:3:4
console.log(arr); //[1,2,3,4],原数组不变
</script>
5.sort()
对数组的元素进行排序。默认是按照字符编码的顺序进行排序,并改变原数组。
代码演示:
<script>
let arr= [5, 20, 40, 100];
console.log(arr.sort()); // [100, 20, 40, 5]
console.log(arr); // [5, 20, 40, 100] (原数组改变)
</script>
如果想要按照数组的大小升序或者降序排列,需要在sort()中传入一个函数,函数格式如下:
<script>
let arr = [5, 20, 40, 100];
arr.sort(function (a, b) {
return a - b // a- b 从小到大排列,b - a 则从大到小排列
})
console.log(arr); // [5,20,40,100] (原数组改变)
</script>
6.reverse()
reverse() 用于颠倒数组中元素的顺序 (原数组会改变)
代码如下:
<script>
let arr = [1, 2, 3, 4];
arr.reverse()
console.log(arr); // [4,3,2,1] (原数组改变)
</script>
7.concat()
concat() 方法用于连接两个或多个数组
代码如下:
<script>
let arr1 = [1, 2, 3, 4];
let arr2 = [5, 6, 7, 8]
let newArr = arr1.concat(arr2)
console.log(newArr); // [1,2,3,4,5,6,7,8]
</script>
8.slice(start , end)
start:必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
end:可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
返回值:返回一个新的数组,包含从 start 到 end (不包括该元素)的 arr 中的元素。
<script>
let arr = [1, 4, 6, 8, 12];
let arrCopy1 = arr.slice(1);
let arrCopy2 = arr.slice(0, 4);
let arrCopy3 = arr.slice(1, -2);
let arrCopy4 = arr.slice(-5, 4);
let arrCopy5 = arr.slice(-4, -1)
console.log(arrCopy1); // [4, 6, 8, 12]
console.log(arrCopy2); // [1, 4, 6, 8]
console.log(arrCopy3); // [4, 6]
console.log(arrCopy4); // [1, 4, 6, 8]
console.log(arrCopy5); // [4, 6, 8]
console.log(arr); // [1, 4, 6, 8, 12] (原数组未改变)
</script>
9.indexOf()和 lastIndexOf()
两个方法都返回要查找的项在数组中首次出现的位置,在没找到的情况下返回-1
① arr.indexOf(item,start) (从数组的开头(位置 0)开始向后查找)
item: 必须。查找的元素。
start:可选的整数参数。规定在数组中开始检索的位置。如省略该参数,则将从array[0]开始检索。
② lastIndexOf(item,start) (从数组的末尾开始向前查找)
item: 必须。查找的元素。
start:可选的整数参数。规定在数组中开始检索的位置。如省略该参数,则将从 array[array.length-1]开始检索。
<script>
let arr = [1, 2, 3, 4, 5, 3, 8, 2];
console.log(arr.indexOf(2)); // 1
console.log(arr.lastIndexOf(2)); // 7
console.log(arr.indexOf(2, 5)); // 7
console.log(arr.lastIndexOf(2, 3)); // 1
console.log(arr.indexOf(7)); // -1
</script>