JS笔记 (九) 数组方法

最新推荐文章于 2021-07-01 09:42:27 发布

DragonLoveYQ

最新推荐文章于 2021-07-01 09:42:27 发布

阅读量111

点赞数

分类专栏：个人学习文章标签： js

本文链接：https://blog.csdn.net/DragonLoveYQ/article/details/110140358

版权

个人学习专栏收录该内容

13 篇文章 0 订阅

订阅专栏

Array() 数组

定义/声明方式

var arr = [];// 字面量； 常用

var arr1 = Array(1,2,3); //函数式
console.log(arr1)// [1,2,3]

var arr2 = Array(6);//[empty × 6]
//只传一个值的时候就创建一个长度为6有6个空值的数组

var arr3 = new Array(1,2,3);//[1,2,3]
var arr4 = new Array(6);//[empty × 6] 同上

length 长度

返回数组的长度

var arr = [1,2,3,4] ; 
console.log(arr.length) // 4
arr.length = 0 // []	清空数组  length	可读可写;

访问 arr.[index]

通过下标访问数组对应的内容从 0 开始

var arr = [1,2,3,4]
console.log(arr[0]) // 1

//二维数组的访问
var arr1 = [1,2,3,[4,5,6]]
console.log(arr1[3][2]) //6   找到下标为3的数组然后 然后再找里面下标为2的值

在后面添加数据

var arr = ['我','爱','你']
arr[arr.length] = '一生一世'
console.log(arr)//["我", "爱", "你", "一生一世"]

方法

concat 数组拼接

注意：原数组不变

var arr = [1,2,3]
var arr1 = [4,5,6]
var arr2 = arr.concat(arr1)
var arr3 = arr.concat(arr1,'我还能接')
console.log(arr)//[1,2,3]
console.log(arr1)//[4,5,6]
console.log(arr2)// 拼接好的 [1, 2, 3, 4, 5, 6]
console.log(arr3)// [1, 2, 3, 4, 5, 6, "我还能接"]

join 拼接成字符串

注意：原数组不变

var arr = ['不','要','分','开','我','们']
console.log(arr.join(''))//"不要分开我们"
console.log(arr.join('-'))//"不-要-分-开-我-们"
console.log(arr) //['不','要','分','开','我','们'] 原数组不变

indexOf 查找数组里的数据

var arr = ['a','b','c','d','e','e','a','b']
console.log( arr.indexOf('b'));  //1    value 匹配字符 
console.log( arr2.indexOf('b',2)); //7  需要寻找得value值，从index开始找 ，合法值是 0 到 arr.length-1 , 默认0 
//匹配失败返回-1

//如果里面增加个[123],那么不能返回对应的下标;

var arr = [1,2,3,4,5,0,[123]];
console.log( arr.indexOf([123]) );

delete 删除项

注意：这种方法删除之后，对应的位置还在，返会对应的项为空值

var arr = [1,2,3,4,5,6]
console.log(delete arr[2])// [1, 2, empty, 4, 5, 6]

unshift ( item,item1,…. ) 在数组头部添加一个或多个元素，并返回（新的长度）

var arr = [5,2,0,1,3,1,4];              
console.log( arr.unshift( '我','对','你','说' ) );  //11 返回（新的长度）
console.log( arr );// ["我", "对", "你", "说", 5, 2, 0, 1, 3, 1, 4]

push( item,item1,…. ) 在数组的尾部添加一个或多个元素，并返回（新的长度）。

var arr = [5,2,0,1,3,1,4];              
console.log( arr.push( '我','对','你','说' ) );  //11 返回（新的长度）
console.log( arr );// [5, 2, 0, 1, 3, 1, 4, "我", "对", "你", "说"]

pop( ) 删除数组的最后一个元素，并返回（删除对象）。

var arr = [1,2,3,4,5,6,7]
console.log(arr.pop()) //7 删除的对象 
console.log(arr)//[1,2,3,4,5,6]

splice

arr.splice(index,how,tiem1,item2) 删除替换添加，返回删除项 --原数组改变

//删除
var arr = [1,2,3,4,5,6]
var arr1 = arr.splice(1,5) //从下标 1 开始以删除 删除个数 5个
console.log(arr) // [1] 
console.log(arr1)// [2, 3, 4, 5, 6] 返回删除项

//替换
var arr = [1,2,3,4,5,6]
var arr1 = arr.splice(1,2,'你好','再见')
console.log( arr );// [1, "你好", "再见", 4, 5, 6] 从下标 1 开始以删除 删除个数 2 个  并且插入 你好，再见
console.log( arr1 );//[2, 3] 返回删除项

//添加
var arr = [1,2,3,4,5,6]
var arr1 = arr.splice(1,0,'你好')
console.log( arr );// [1, "你好", 4, 5, 6] 从下标 1 开始以删除 删除个数 0 个  并且插入在下标1后面添加 你好
console.log( arr1 );// 返回删除项 删除0个[]

sort() 排序

若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0
若 a 大于 b，则返回一个大于 0 的值

正序 ( 冒泡排序 )
a - b > 0
倒序 ( 冒泡排序 )
b - a

var arr = [1, 2, 3, 5, 8, 9, 7, 5, 321]
console.log(arr.sort())// [1, 2, 3, 321, 5, 5, 7, 8, 9]没规定排列排序是按照字符串的Unicode码，321的比后面的小，则他在前面
var arr1 = [1, 2, 3, 5, 8, 9, 7, 5, 321]
console.log(arr1.sort( function(a,b){
	console.log(a-b)
	return a - b}
))//[1, 2, 3, 5, 5, 7, 8, 9, 321]
// return b - a //[321, 9, 8, 7, 5, 5, 3, 2, 1]

reverse() 反转数组

var arr = [1,2,3,4,5,6,7,8,9]
console.log(arr.reverse())// [9, 8, 7, 6, 5, 4, 3, 2, 1]

slice 切割/截取

原数组不变，返回一个新的数组，包含 start 不包含 end （结束）的数组

var arr = [1,2,3,4,5,6,7,8,9]
console.log(arr.slice(1,8))//2, 3, 4, 5, 6, 7, 8]

会把数组里的每一项都调用一次回调函数，然后返回新数组

var arr = [1,2,3,4,5,6,7,8,9]
	arr.map( x =>  x * 2)//[2, 4, 6, 8, 10, 12, 14, 16, 18] 数组每一项都执行一次函数

forEach

用来处理数组里的每一项

<body>
	<button>1</button>
	<button>2</button>
	<button>3</button>
</body>
<script>
	var btn = [...document.getElementsByTagName('button')]
    console.log(btn)
	btn.forEach(function(val,idx,self){
		val.onclick = function (){
			console.log(idx) //打印出所点击对象对应的下标
		}
	})
</script>

filter() 过滤数组

过滤掉给出的条件

var arr = [1,2,3,4,5,6,7,8,9]
        var arr1 = arr.filter(function(x){
            if(x > 5){ 
                return x
            }
        })
        console.log(arr1)// [6, 7, 8, 9]

DragonLoveYQ

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS笔记 (九) 数组方法

Array() 数组定义/声明方式var arr = [];// 字面量；常用var arr1 = Array(1,2,3); //函数式console.log(arr1)// [1,2,3]var arr2 = Array(6);//[empty × 6]//只传一个值的时候就创建一个长度为6有6个空值的数组var arr3 = new Array(1,2,3);//[1,2,3]var arr4 = new Array(6);//[empty × 6] 同上length 长
复制链接

扫一扫