JavaScript_数组&&数组的方法

数组

什么是数组:

  • 一系列的数据集合

定义数组

	字面量:		var arr = [];
	内部构造函数:var arr = new Array();
	length:	表示数组的长度(数组中数据的个数)
	arr[index]:数组中的索引值(下标),数组中表示数据的唯一值,0开始

创建数组

	var arr = [10];//创建一个数据只有10的数组
	var arr = new Array(10);//创建一个长度为10的空数组
	var arr = new Array(10,20);//创建一个数据包含10,20的数组

数组的简单操作

不使用数组的方法给数组添加值
只能通过索引的方式添加

	var arr = [];
	arr[0] = 10;
	arr[1] = 20;
	arr[0] = 'abc';//没有就添加abc,有就修改为abc
	delete arr[0];//删除

清空数组

	arr.length = 0;

二维数组

	var arr = [10,20,'a',true,[1,2,3,4]];
	console.log(arr[4][0]);
	//1

数组的方法:

数组方法用来操作数组

  1. push() 向数组中追加一个元素/数据
    返回值:添加之后数组的长度
    改变原始数组
	var arr = [1,2,3];
	var res = arr.push(6);
	console.log(res);//4
	console.log(arr);//[1,2,3,6]
  1. pop() 删除数组中最后一个元素
    返回值:删除的那个元素
    改变原始数组
	var arr = [1,2,3];
	var res = arr.pop();
	console.log(res);//3
	console.log(arr);//[1,2]
  1. unshift() 在数组中的最前面添加数据
    返回值:添加之后的长度
    改变原始数组
	var arr = [1,2,3];
	var res = arr.unshift('a');
	console.log(res);//4
	console.log(arr);//['a',1,2,3]
  1. shift() 删除数组中的第一个元素
    返回值:删除的那个元素
    改变原始数组
	var arr = [1,2,3];
	var res = arr.shift();
	console.log(res);//1
	console.log(arr);//[2,3]
  1. splice(index,length) 删除任意位置的数据
    index:删除元素的开始位置(索引) 必填
    length:删除的个数,选填,当不写length的时候,删除后面的所有数据
    返回值:以数组的形式返回被删除的数据
    改变原始数组
	var arr = [1,2,3,4,5,6]
	var res = arr.splice(2,1);//从索引为2的位置开始删除1个数据
	console.log(res);//[3]
    console.log(arr);//[1, 2, 4, 5, 6]
 附:
 splice(index,length,value替换)
 用value替换删除的数据
	//用'a'来替换索引为2的数据
	var res = arr.splice(2, 1, 'a');
	console.log(res);[3]
    console.log(arr);[1, 2, "a", 4, 5, 6]
	//在索引为2的位置添加一个数据为'a',其他数据往后移动
    var res = arr.splice(2, 0, 'a');
    console.log(res);//[]
    console.log(arr);//[1, 2, "a", 3, 4, 5, 6]
	//在索引为2的位置删除两个数 并用'a'替换
    var res = arr.splice(2,2,'a');
    console.log(res);//[3,4]
    console.log(arr);//[1, 2, "a", 5, 6]
  1. slice(startIndex,endIndex) 截取数组,包括开始位置索引值但不包括结束位置索引值
    startIndex:开始的索引 必填
    endIndex:结束的索引 选填 不写时从索引值到最后截取
    返回值:截取出来的值
    不改变原始数组
	var arr = [1,2,3,4,5,6];
	var res = arr.slice(1,2);
	console.log(res);//[2]
	console.log(arr);//[1, 2, 3, 4, 5, 6]
	var arr = [1,2,3,4,5,6];
	var res = arr.slice(1);
	console.log(res);//[2,3,4,5,6]
	console.log(arr);//[1, 2, 3, 4, 5, 6]
  1. reverse() 反转数组
    返回值:反转之后的数组
    改变元素数组
	var arr = [1, 2, 3, 4, 5, 6];
	var res = arr.reverse()
    console.log(arr);//[6, 5, 4, 3, 2, 1]
    console.log(res);//[6, 5, 4, 3, 2, 1]
  1. concat() 合并数组
    返回值:合并后的数组
    不改变原始数组
	var arr = [1, 2, 3, 4, 5, 6];
	var arr1 = ['a', 'b'];
	var res = arr.concat(arr1);
    console.log(res);//[1, 2, 3, 4, 5, 6, "a", "b"]
    var res = arr.concat(10,20,30);
    console.log(res);//[1, 2, 3, 4, 5, 6, 10, 20, 30]
    var res = arr.concat(arr1,[10,20,30]);
    console.log(res);//[1, 2, 3, 4, 5, 6, "a", "b", 10, 20, 30]
  1. sort() 数组排序
    改变原数组

当sort()不传递参数的时候,默认按照字符ASCII码进行排序
如果要排序数字的大小,需要给sort添加一个回调函数,回调函数中有两个参数
回调函数中:
return 参数1 - 参数2 升序
return 参数2 - 参数1 升序

	var arr = [2,4,5,3,1];
	arr.sort(function(a,b){
		return a - b; //升序
		return b - a; //降序
	})
	console.log(arr);//[1,2,3,4,5]
  1. join() 把数组转换为字符串
    返回值:转换好的字符串,默认以逗号连接数组中的每一个数据
    不改变原始数组

join(’ ') 表示用空字符串拼接数组中的数据

	var arr = [1,2,3,4]
	var res = arr.join('')
	console.log(res);//1234
  1. indexOf() 判断数组中是否存在某个数据
    返回值:如果存在就返回这个数据的索引值
    如果不存在就返回 -1
	var arr = [1,2,3,4];
	console.log(arr.indexOf(3));//2

ES5中数组的方法

  1. map() 映射
	语法:
	数组.map(function(item,index,arr){
		return 你要写的操作
	})
	item: 数组中每一个数据
	index:索引
	arr:原始数组

案例:

	var arr = [1, 2, 3, 4, 5, 6];
    var res = arr.map(function (item, index, arr) {
        console.log(item);//1;2;3;4;5;6
        console.log(index);//0;1;2;3;4;5
        console.log(arr);//[1, 2, 3, 4, 5, 6]
        return item + 10;
    })
    console.log(res);//[11, 12, 13, 14, 15, 16]
  1. forEach() 循环
	语法:
	数组.forEach(function(item,index,arr){
	})
	item: 数组中每一个数据
	index:索引
	arr:原始数组

案例:

	var arr = [10, 20, 30, 40, 50];
	var res = arr.forEach(function (item, index, arr) {
		//不需要有return
		//循环的次数:数组的长度是多少就会循环多少次
		//forEach循环中  不可以写 break 和 continue
		if (item == 20) {
			//虽然不可以添加返回值 但是可以用return来终止函数的执行.
			return;
		}//10 30 40 50 
		if(item >= 20){
		    return;
		} //10
		console.log(item);
		});
  1. filter() 过滤器
	语法:
	数组.filter(function(item,index,arr){
		return 条件
	})
	item: 数组中每一个数据
	index:索引
	arr:原始数组

案例:

	var arr = [10, 20, 30, 40, 50];
	//从原始数组中过滤出满足条件的元素 并且返回一个新的数组
    var res1 = arr.filter(function (item) {
    	return item > 10 && item < 40;
    })
    console.log(res1);//[20, 30]
  1. some() 判断数组中是否有满足条件的数据
    返回值:布尔值
	语法:
	数组.some(function(item,index,arr){
	return 条件
	})

当数组中有一个数据满足条件就返回true,所有数据都不满足条件返回false

案例:

	var arr = [10, 20, 30, 40, 50];
	var res2 = arr.some(function (item) {
    	return item % 8 == 0;
    })
    console.log(res2);//true
  1. every() 判断数组中所有的数据是否满足条件
    返回值:布尔值
	语法:
	数组.every(function(item,index,arr){
		return 条件;
	})

当数组中所有数据都满足条件就返回true,其中有一个数据不满足条件就返回false

案例:

	var arr = [10, 20, 30, 40, 50];
	var res3 = arr.every(function (item) {
    	return item % 10 == 0;
    })
    console.log(res3);//true
  1. reduce() 累加器
	语法:
	数组.reduce(function(pre,item,index,arr){
	
    },value)
    pre:初始值
    value:就是给pre设置初始值,不写value的话,pre的初始值默认为数组中第一个元素,并且整个循环少循环一次
    item:数组中的每一项
    index:索引值
    arr:原始数组
	正常累加:
	var arr = [1, 2, 3, 4];
	var sum = 0;
	for (var i = 0; i < arr.length; i++) {
	   sum += arr[i];
	}
	console.log(sum);//10
	使用reduce累加:
	var arr = [1, 2, 3, 4];
	var res = arr.reduce(function (pre, item) {
    	// 前一次的循环 return pre + item 会把这个结果给到pre
    	//下一次循环 return pre + item 这个pre的值为上一次循环果
    	return pre + item;
    	//一定要有return,否则下一次循环的时候pre的值为undefined
	}, 0);
	console.log(res);
	reduce 配合 箭头函数实现累加累乘:
	var  arr = [1, 2, 3, 4];
	var sum = arr.reduce((x,y)=>x+y)
	console.log( sum ); //10
	var mul = arr.reduce((x,y)=>x*y)
	console.log( mul ); //24
	利用reduce去重:
	var arr = [1, 1, 2, 3, 4, 4, 2, 1, 3, 5];
	var res = arr.reduce(function (pre, item) {
    	// 把pre当成新数组,pre的默认值为空数组
    	if (pre.indexOf(item) == -1) {
            // 如果pre数组中不存在item这个数据,就需要把item添加到pre中
            // push()返回值是一个数组的长度(数字),相当于下一次循环 pre的值为数字,不是数组 不能进行判断
            // return pre.push(item);
			// concat() 函数的返回值为数组
                return pre.concat(item);
       	}
        return pre;
	}, [])
	console.log(res);
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值