现代Javascript教程 - 学习笔记02 - 数组

173 阅读3分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第2天,点击查看活动详情

字符串内容,已完成笔记,开始记录数组的内容!

基础概念 + api

学习链接

数组简介

数组

  • 存储的是有序的 - 分配了连续的地址空间
  • 也是基于对象实现的 - typeof - 引用!
  • 编号从0开始
  • length属性 - 获取数组中的总个数

数组内部!- 对象也是用中括号获取的 - 中括号里面是键!

数组是一种特殊的对象。使用方括号来访问属性 arr[0] 实际上是来自于对象的语法。它其实与 obj[key] 相同,其中 arr 是对象,而数字用作键(key)。

数组声明有两种

  • new Array(); - 可以创建二维数组
  • [] - 常用! - 可以定义,也可以获取(替换)该位置上的值

常用方法

  • pop
  • push
  • shift - 删除头部,后面都需要移动 - 速度慢
  • unshift - 从头插入 - 需要移动后面所有元素 - 速度慢

可以实现的两种数据结构

  • 队列 - 想象一下排队。。先进先出
  • 栈 - 想象一个抽卡片.。后进先出

使用数组不要出现的几种方式

  • 给数组添加属性 - 应该用下标来赋值,如果添加属性,会把数组当成对象处理 - 引擎
  • 数组制造空洞 - 定义0位置,定义999999位置,浪费空间
  • 倒序填充数组 - 从9999999开始。。不可为。

循环

  • for of - 对数组的优化迭代方法 - 获取到的是值!

为什么不能用for in

  • for in 对于类数组,会遍历出额外信息
  • 速度 - for in给对象的便利做了优化,而不是数组

image.png

length属性

  • 修改数组时,会自动更新
  • 最大的数字索引值 + 1
  • 可写 - 让它等于 0 ,整个数组就清空了 - 整个过程不可逆,删了就没了

toString

  • 把数组改成字符串

image.png

不要用 == 来比较数组。。

所以,如果我们使用 == 来比较数组,除非我们比较的是两个引用同一数组的变量,否则它们永远不相等。

image.png


数组方法

这里到数组方法,教程的另一内容!同属于数组的!一起总结!

api汇总!

  • push,pop,shift,unshift - 可以实现队列和栈

  • splice - 它可以做所有事情:添加,删除和插入元素。

  • slice - 也是提取!start到end ,end不包括

  • concat - 连接两个数组 - alert( arr.concat([3, 4]) ); // 1,2,3,4

  • forEach - 可以包含值,下标,整个数组

  • indexOf,lastIndexOf,includes - 前两个通过值,找到下标,后一个,有就返回true

  • find,findIndex - find 方法搜索的是使函数返回 true 的第一个(单个)元素。

  • filer - 返回所有满足条件的元素!

  • map - 转换数组 - 返回新的数组,对数组中的所有元素进行转换!

  • sort - 比较函数只需要返回一个正数表示“大于”,一个负数表示“小于”。推荐箭头函数!

  • reverse - 翻转数组

  • split和join,一个用来拆,一个用来合并 - 分 合

  • reduce / reduceRight - 累加器!

  • Array.isArray - 因为用typeof不能区分数组和对象,是为true

image.png

image.png

总结

主要是列举了数组相关的api,实战中继续练习吧,每天进步一点点,加油!

道阻且长,只要我们一直努力前行,我们平凡的生命也能画出一条星光闪耀的轨迹。追光的人,终会光芒万丈。——《人民日报》