JavaScript----数组对象

目录

🍓什么是数组?

🍓创建数组的两种方式

🐇Array()构造函数的方式创建数组

🐇字面量方式创建数组

🍓检测是否为数组的两种方式

🐇instanceof 运算符

🐇Array.isArray() 

🍓遍历数组的三种方式

🐇  for循环

🐇  for  in

🐇  forEach()

🐇  map()映射

🐇  forEach() 求和

🐇  随机数组

🐇 map() 映射 对应 

用map()做判断

🍓数组对象 方法

🐇pop()  删除

🐇shift()  删除

🐇push()  添加

🐇unshift()  添加

🍓数组排序

🐇recerse()

🐇  sort()

🐇 toString()   数组转换为字符串

🐇concat

🐇join()

🐇splice()

🐇filtre() 过滤去重

🐇reduce() 迭代求和



🍓什么是数组?

数组是可以在内存中连续储存多个元素的结构

下表索引从[ 0 ]开始,通过length获取数组总长度

数组上下界[ 0,arr.length-1 ]

🍓创建数组的两种方式

🐇Array()构造函数的方式创建数组

语法:

1. var arr = new Array() 创建了一个空数组

2. var arr = new Array(参数1 ,参数2,......) 可以在赋值给变量的时候添加参数

3. var arr = new Array(4,8); 如果一个数字 则表示创建了一个长度为4 的空数组 如果是两个数字 则表示创建了一个4和8的数组

		//构造函数方式
		var arr=new Array();//创建了一个空数组
		var arr=new Array(10;"hello",true,"abc");
		var arr=new Array(2);//创建了一个长度为2的数组,但还是一个空数组


🐇字面量方式创建数组

		//字面量方式
		var arr=[];//创建了一个空数组
		var arr=[10;"hello",true,"abc"];

🍓检测是否为数组的两种方式

🐇instanceof 运算符

		var arr=[];
		var obj={};
		console.log(arr instanceof Array);//true
		console.log(obj instanceof Array);//false

🐇Array.isArray() 

		//检测是否为数组  Array.isArray()  h5新增方法		
        var arr=[];
		var obj={};
		console.log(Array.isArray(arr));//true
		console.log(Array.isArray(obj));//false

🍓遍历数组的三种方式

🐇  for循环

		var arr=[1,2,3,"hello",true,"abc"];
		for(var i=0;i<arr.length;i++){
			console.log(arr[i]);
		}

🐇  for  in

语法结构:

for in(var i in 数组){数组[变量]} 输出的数字为字符串形式 常用与遍历字符串的索引

		var arr2=[1,2,3,"hello",true,"abc"];
		for(var i in arr2){
			console.log(arr2[i]);
		}

🐇  forEach()

语法结构:

arr.forEach(function(item,i,arr){})

arr.forEach(function(参数,索引,arr数组){cosole.log(参数)})

		arr.forEach(function(item,i,arr){
			console.log(item);//遍历数组中的每一个元素
			console.log(i);//索引号,下标
			console.log(arr);//当前元素的数组
		})

🐇  map()映射

和 forEach()在遍历的时候用法一样

		arr.map(function(item, i, arr) {
			console.log(item); //遍历数组中的每一个元素
			console.log(i); //索引号,下标
			console.log(arr); //当前元素的数组
		})

🐇  forEach() 求和

		var res=[100,98,45,67,93,32,56];
		var sum=0;
		res.forEach(function(item){
			sum+=item;
		});
		console.log("求和结果为:",sum);//求和结果为: 491

🐇  随机数组

		var nameArr=["翠花","富贵","铁牛","二狗","龙傲天"];
		for(var i=0;i<nameArr.length;i++){
			console.log(i);
			console.log(nameArr[i]);
		}
		var a=Math.floor(Math.random()*5);
		console.log(a);
		console.log(nameArr[a]);

🐇 map() 映射 对应 

arr.map(function(参数,索引,arr数组){console.log(参数)})

有返回值 返回一个新数组

新数组的长度和原数组一样 与原数组是是一一对应的映射关系

举个栗子:

用map()做判断

		var res=[100,67,44,88,68,90];
		var a=res.map(function(item,i,arr){
			// console.log(item);//遍历的每个元素
			if(item>=60){
				return"及格";
			}else{
				return "不及格"
			}
		});
		console.log(a); //['及格', '及格', '不及格', '及格', '及格', '及格']


🍓数组对象 方法

🐇pop()  删除

  1. pop()删除数组最后一个元素
  2. 返回的是他删除的元素的值  
  3. pop()里面不跟参数,并且一次只能删除一个
		 var arr = ["hello", 110, 120, "abc"];
		 console.log(arr.pop());//abc
	     console.log(arr);//0: "hello"110 120
    

🐇shift()  删除

  1. pop()删除数组最后一个元素
  2. 返回的是他删除的元素的值  
  3. pop()里面不跟参数,并且一次只能删除一个
		var arr = ["hello", 110, 120, "abc"];
		console.log(arr.shift());//hello
		console.log(arr);[110, 120, 'abc']

🐇push()  添加

  1. 在数组的尾部添加一个或多个数值
  2. 把添加的数值放在括号中
  3. 添加多个元素用逗号隔开
  4. 返回值为新数组的长度
		var arr = ["hello", 110, 120, "abc"];
		console.log(arr.push("yaya"));//5
		console.log(arr);//['hello', 110, 120, 'abc', 'yaya']

举个栗子:

让一个包含成绩的数组[60,50,98,76,89,34,77,63]要求把成绩低于60的删除,剩余的放到新数组里面

		var arr1 = [60, 50, 98, 76, 89, 34, 77, 63];
		var newArr = [];
		for (var i = 0; i < arr1.length; i++) {
			if (arr1[i] > 60) {
				newArr.push(arr1[i]);
			}
		}
		console.log(newArr);//[98, 76, 89, 77, 63]

🐇unshift()  添加

  1. 在数组的头部添加一个或多个数值
  2. 把添加的数值放在括号中
  3. 添加多个元素用逗号隔开
  4. 返回值为新数组的长度
		var arr = ["hello", 110, 120, "abc"];
        console.log(arr.unshift("yeye")); //5
		console.log(arr);//['yeye', 'hello', 110, 120, 'abc']

🍓数组排序

🐇recerse()

方法用于颠倒数组中元素的顺序

		var arr=[10,3,6,"hello",true,8];
		arr.reverse();//颠倒数组,
		console.log(arr);//会修改原数组,颠倒
		//[8, true, 'hello', 6, 3, 10]

🐇  sort()

语法结构:

 sort(function (a,b){return a - b})

在括号中输入一个函数 或匿名函数 用于按照ASCII排序 默认从大到小排序 交换a 和b的顺序进行参数升序或降序的排序 返回值为排序后的新数组

举个栗子:

		var arr = [12, 1, 5, 7, 90, 29, 8, 9];
		arr.sort(function(x, y) {
			// return x-y;//升序
			return y - x; //降序
		});

		//下面是封装过的排序数组
		arr.sort(fn);

		function fn(a, b) {
			// return a-b;//升序
			return b - a; //降序
		}
		console.log("排序后的数组", arr);

🐇 toString()   数组转换为字符串

			var arr=[1,2,3];
			console.log(arr.toString());//1,2,3

🐇concat

concat()方法用于两个参数的拼接或运算 多个参数或数组用逗号隔开 也可以拼接数组

        arr.concat(参数)
        参数:待连接的数组或元素,多个数组或元素之间用逗号隔开
        返回值:连接后的数组

	var arr=[10,3,6,"hello",true,8];
		var arr1=["abc",100];
		console.log(arr.concat(arr1,"welcome"));

🐇join()

可以进行数组与字符串的互相转换 用于数组中子串的连接 可以自定义分隔符 也可以添加空串

		var arr=[10,3,6,"hello",true,8];
		console.log(arr.join());//10,3,6,hello,true,8
		console.log(arr.join("-"));//10-3-6-hello-true-8

🐇splice()

splice(方法向或从数组中添加或删除项目然后返回被删除的项目

arr.splice(参数1,参数2,参数3) 从参数1的位置删除参数2个元素 并把参数3添加到参数1的位置

参数1 必须 书写数字整数规定添加或删除项目的位置 使用数可以从数组结尾出规定位置 如果为负值 则是从项目后方开始删除

参数2 必须 书写数字 删除的数量 可以为0

参数3 添加的参数 可以是数字 字符串 或数组等

		var arr = [10, 7, "hello", 8, true];
		console.log(arr.splice(2, 2)); // ['hello', 8]
		console.log(arr);//[10, 7, true]
		console.log(arr.splice(-2, 2)); //[7, true]
		console.log(arr);//[10]
		console.log(arr.splice(-2, 2, "world", 100, "abc")); //[10]
		console.log(arr);//['world', 100, 'abc']
		console.log(arr.splice(2, 2, "world", 100, "abc")); //['abc']
		console.log(arr); //['world', 100, 'world', 100, 'abc']

🐇filtre() 过滤去重

arr.filter(function(item,索引,arr){})

返回值是一个新数组 ,新数组中的元素是通过检查指定数组中符合条件的所有元素,如果没有符合条件的则返回一个空数组

		var newArr = arr.filter(function(item, i) {
			return arr.indexOf(item) === i;
		});
		//简写成箭头函数方式
		var newArr = arr.filter((item, i) => arr.indexOf(item) === i);
		console.log(newArr);

🐇reduce() 迭代求和

将数组元素计算为一个值 从左到右求和
数组.reduce(function(total,item,i,arr){return toral + item},0(0是初始值赋值给total))

如果不写初始值 则数组的第一个元素当做初始值

如果不写return 返回值 则返回值为undefined

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值