JavaScript数据结构及算法---数组

前言

看到标题的小伙伴们,肯定很懵?园丁不是要搞懂数组的一系列方法吗?咋玩起文字游戏了?! 别急,我们还是了解下数组到底是什么.

什么是数组

数组就是一组数据的集合,其表现形式就是内存中的一段连续的内存地址,数组名称其实就是连续内存地址的首地址.

数组特点

  • 数组定义时无需指定数据类型,编译器会自动推断数组中值的类型
  • 数组定义时无需指定数组的长度,数组的长度为数组本身的属性
  • 数组可以存储任何数据类型的数据

简而言之,数组可以存放各种数据类型,数组会根据其元素的个数修改数组的长度.

数组定义

一般来说,数组的定义方式有两种,通过构造方法和字面量,两种方法
(1) 构造函数创建数组

let arr = new Array((数组的元素或数字));
// 元素 直接作为数组中的值
// 数字 直接作为数组的长度
let arrother = new Array(5);

console.log(arrother);// [empty x 5]

注意 如果数组的长度小于实际数组长度,则没有元素的位置补上empty(empty的位置的元素为undefined)

(2) 字面量

let arr = [数组元素]
// 元素 直接作为数组中的值
let newArr = [1,2,3,4];

console.log(newArr); // [1,2,3,4]

这两种方式在创建数组过程中没有本质的区别,只不过采用字面量形式更加简洁明了,推荐使用字面量形式.

数组方法

数组固有的方法前前后后加起来大概有三十几个,对于大多数小伙伴很难在第一时间内记住这些方法.园丁记忆这些方法常用两种方式:

  • 归类法
    将数组方法执行后将会改变原有数组的方法归为一类,将数组方法执行后不会改变原数组的方法归为另一类
  • 对比法
    有进就有出,数组也是一样的.比如pop()push(),一个是从数组中末尾的位置删除一个元素,并返回被删除元素的值,另一个是从数组中末尾的位置添加一个或多个元素,并返回添加元素后数组的长度.

在实际学习过程中,小伙伴们可以根据自己的情况选择适合自己的记忆方法.

兜了一大圈,说重点. 数组中常用方法会在本文讲解,其余的方法将在接下来的文章中讲解!

push

这个方法在前面解释过了,我们重新来看一下这个方法,加深对这个方法的认识.

// push
// 作用: 将一个或多个元素添加到数组的末尾,并返回该数组的长度
const fruits = ["apple","watermelon","peach"];
const fruitsLen = fruits.push("pineapple");
console.log(fruits); // ["apple","watermelon","peach","pineapple"]
console.log(fruitsLen);// 4
pop

这个方法与前面的push方法作用相反.

// pop
// 作用: 从数组中删除最后一个元素,并返回删除元素的值.数组及数组的长度都会发生改变.
// 返回值: 被删除的元素
const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];
console.log(plants.pop()); // tomato
console.log(plants);// ["broccoli", "cauliflower", "cabbage", "kale"]
map

这个方法在实际开发过程中使用到的频率非常高,掌握这个方法可以很好的操作数组.

// map
// 作用: 创建一个新数组,其结果是该数组中的每一个元素是调用一次提供的函数返后的返回值.
// 返回值: 一个回调函数处理后的数组,数组的长度不会发生改变,数组的值会发生改变.
const numbersArr = [1,3,5,7];
const numbersArrDeal = numberArr.map(x => x*2);
console.log(numbersArrDeal); // [2,6,10,14]
forEach

这个方法用来遍历一个数组的内容非常合适,园丁从自己的leader得知,forEach遍历数组的效率比较高.

// forEach
// 作用: 对数组的每一元素执行一次给定的函数.
// 返回值: undefined. 数组的长度不会发生改变,数组的值发生改变.
const arrayT = ['a', 'b', 'c']; 
arrayT.forEach(element => console.log(element));
// a
// b
// c

注意 除了抛出异常以外, 没有办法中止或跳出forEach()循环.

concat

这个方法用来合并两个或多个数组.

// concat
// 作用: 合并两个或多个数组,形成新的数组
// 返回值: 由两个或多个数组构成的一个新数组.数组的长度不会发生改变,数组的值也不会发生改变
const basket1 = ["apple"];
const basket2 = ["pineapple"];
const basket3 = ["peach"];
const bigBasket = basket1.concat(basket2,basket3);
console.log(bigBasket);// ["apple", "pineapple", "peach"]

注意 concat不会递归遍历参数,也就是说concat只进行浅拷贝.

join

这个方法将一个数组(或类数组对象)的所有元素连接成一个字符串.

// join
// 作用: 将一个数组(或类数组对象)的所有元素形成一个字符串.
// 返回值: 所有数组元素连接的字符串,如果数组的长度为0,则返回空字符串.数组的长度不会发生改变,数组的值也不会发生改变.
const elements = ['Fire', 'Air', 'Water'];
console.log(elements.join()); // Fire,Air,Water
console.log(elements.join(''));// FireAirWater
console.log(elements.join('-'));// Fire-Air-Water
shift

从数组中删除第一个元素,并返回该元素的值。

// shift 
// 作用: 从数组中删除第一个元素,并返回该元素的值.
// 返回值: 从数组中删除的元素; 如果数组为空则返回undefined. 数组长度和值都发生改变.
const array1 = [1, 2, 3];
const firstElement = array1.shift();
console.log(array1); // [2, 3]
unshift

将一个或多个元素添加到数组的开头,并返回该数组的新长度(该方法修改原有数组).

// unshift
// 作用: 将一个或多个元素添加到数组的开头,并返回该数组的新长度(该方法修改原有数组).
// 如果传入多个参数,它们会被以块的形式插入到对象的开始位置,它们的顺序和被作为参数传入时的顺序一致.数组长度和值发生改变.
// 返回值: 原数组新的长度
const array1 = [1, 2, 3];
console.log(array1.unshift(4, 5)); // 5
console.log(array1); // [4, 5, 1, 2, 3]
filter

这是一个比较重要的数组方法,用来创建一个新数组,其包含通过所提供函数实现的所有元素.

// fileter
// 作用: 创建一个新数组,其包含满足函数测试条件的元素.原数组的长度和值都不会发生改变.
// 返回值: 通过函数测试条件的元素形成的数组.如果没有任何数组通过测试,则返回空数组.
const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);
console.log(result); // ["exuberant", "destruction", "present"]
splice

通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容.此方法会改变原数组.
如果指定修改的开始位置的值超过了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位;如果负数的绝对值大于数组的长度,则表示开始位置为第0位.
如果删除位置的元素个数是0或负数,则不移除元素.

// splice
// 作用: 通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容.数组长度和值发生改变.
const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');// Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May'); // ["Jan", "Feb", "March", "April", "May"]

总结

本篇文章大概讲述了数组常用的集中方法,熟悉并掌握这几种方法,能高效率编程.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值