文章目录
什么是数组?
数组对象是使用单独的变量名来存储一系列的值。
如果你有一组数据(例如:车名字),存在单独变量如下所示:
var car1="Saab";
var car2="Volvo";
var car3="BMW";
如果你想从很多数据中找出想要的数据,最好的方法就是用数组。
数组可以用一个变量名存储所有的值,并且可以用变量名访问任何一个值。
数组中的每个元素都有自己的的ID,以便它可以很容易地被访问到。
创建一个数组
创建一个数组,有三种方法。
下面的代码定义了一个名为 myCars的数组对象:
1: 常规方式:
var myCars=new Array();
myCars[0]="Saab";
myCars[1]="Volvo";
myCars[2]="BMW";
2: 构造函数语法
var 变量 = new Array();
var myCars=new Array("Saab","Volvo","BMW");
3: 常用语法 字面量
var 变量 = [ 数据1 , 数据2 , 数据3 … ];
在 [ ] 中 定义 要存储的多个数据
每个数据之间使用 逗号 间隔
var myCars=["Saab","Volvo","BMW"];
访问数组
通过指定数组名以及索引,可以访问某个特定的元素。(第一个元素索引是从 0 开始)
//可以访问myCars数组的第一个值:
var name=myCars[0];
//修改了数组 myCars 的第一个元素:
myCars[0]="Opel";
数组中包含对象元素、函数、数组:
myArray[0]=Date.now;
myArray[1]=myFunction;
myArray[2]=myCars;
使用数组对象预定义属性和方法:
var x=myCars.length // myCars 中元素的数量
var y=myCars.indexOf("Volvo") // "Volvo" 值的索引值
Array 对象
Array 对象用于在变量中存储多个值:
var cars = ["Saab", "Volvo", "BMW"];
数组属性
属性 | 描述 |
---|---|
constructor | 返回创建数组对象的原型函数。 |
length | 设置或返回数组元素的个数。 |
prototype | 允许你向数组对象添加属性或方法。主要作用:对数组进行扩展 |
1.length
每一个数组,天生就有 length 属性 表示数组长度 也就是 数组单元个数
调用方式 数组.length
最后一个单元的索引下标是数组.length-1
//需要注意的是,直接给数组的 length 赋一个新的值会导致数组大小的变化:
var arr = [1, 2, 3];
arr.length; // 3
arr.length = 6;
arr; // arr 加长为 [1, 2, 3, undefined, undefined, undefined]
arr.length = 2;
arr; // arr 缩短为 [1, 2]
//数组可以通过索引把对应的元素修改为新的值。
//如果通过索引赋值时,索引超过了范围,同样会引起数组大小的变化:
var arr = [1, 2, 3];
arr[5] = "x";
arr; // arr 变为 [1, 2, 3, undefined, undefined, "x"]
数组的修改和新增
数组的修改:
数组[索引下标] = 数值
本质上 是 对 数组单元 重新赋值
后赋值的数据覆盖之前的数据
效果就是修改数组单元存储的数据
数组的新增:
数组[索引下标] = 数值
本质上 是 对 没有的索引下标赋值
也就是 新增一个数组单元 存储数据
同时 人为的定义数组单元的索引下标
新增数组单元的索引下标必须连续
原始数组 最后一个索引下标是 数组.length-1
新增数组单元的索引下标是 数组.length-1+1
也就是 数组.length
var arr = [1,2,3,4,5];
// 将3 修改为 '北京'
// 也就是对 存储3的 单元 重新 赋值 字符串'北京'
// 也就是对 索引下标是 2的单元重新赋值 字符串'北京
// 已有的单元,索引下标是修改
arr[2] = '北京';
// 没有的单元 是 新增
arr[5] = '新增';
//
arr[arr.length] = '新增';
console.log(arr); //控制台输出如下
//Array(7)
//0: 1
//1: 2
//2: "北京"
//3: 4
//4: 5
//5: "新增"
//6: "新增"
//length: 7
2.prototype 返回对象类型原型的引用 (主要作用:对数组进行扩展)
//向数组中添加 max 方法, 使得数组可以使用 max() 取得 最大值
function max() {
var ele = this[0];
for(var i = 0; i < this.length-1; i++) {
ele = this[i] > this[i+1] ? this[i] : this[i+1];
}
return ele;
}
Array.prototype.max = max;
[1,2,5,4,6].max() // 6
Array 对象方法
方法 | 描述 |
---|---|
concat() | 连接两个或更多的数组,并返回结果。 |
copyWithin() | 从数组的指定位置拷贝元素到数组的另一个指定位置中。 |
entries() | 返回数组的可迭代对象。 |
every() | 检测数值元素的每个元素是否都符合条件。 |
fill() | 使用一个固定值来填充数组。 |
filter() | 检测数值元素,并返回符合条件所有元素的数组。 |
find() | 返回符合传入测试(函数)条件的数组元素。 |
findIndex() | 返回符合传入测试(函数)条件的数组元素索引。 |
forEach() | 数组每个元素都执行一次回调函数。 |
from() | 通过给定的对象中创建一个数组。 |
includes() | 判断一个数组是否包含一个指定的值。 |
indexOf() | 搜索数组中的元素,并返回它所在的位置。 |
isArray() | 判断对象是否为数组。 |
join() | 把数组的所有元素放入一个字符串。 |
keys() | 返回数组的可迭代对象,包含原始数组的键(key)。 |
lastIndexOf() | 搜索数组中的元素,并返回它最后出现的位置。 |
map() | 通过指定函数处理数组的每个元素,并返回处理后的数组。 |
pop() | 删除数组的最后一个元素并返回删除的元素。 |
push() | 向数组的末尾添加一个或更多元素,并返回新的长度。 |
reduce() | 将数组元素计算为一个值(从左到右)。 |
reduceRight() | 将数组元素计算为一个值(从右到左)。 |
reverse() | 反转数组的元素顺序。 |
shift() | 删除并返回数组的第一个元素。 |
slice() | 选取数组的一部分,并返回一个新数组。 |
some() | 检测数组元素中是否有元素符合指定条件。 |
sort() | 对数组的元素进行排序。 |
splice() | 从数组中添加或删除元素。 |
toString() | 把数组转换为字符串,并返回结果。 |
unshift() | 向数组的开头添加一个或更多元素,并返回新的长度。 |
valueOf() | 返回数组对象的原始值。 |
查询数组中 是否存储了某一个数值【indexOf】【lastIndexOf】
数组.indexOf()
查询匹配数据 第一次出现的位置
如果 有 匹配数据 返回值 是 存储这个数据单元的索引下标
如果没有 匹配数据 返回结果是 -1
数组.lastIndexOf()
查询匹配数据 最后一次出现的位置
如果 有 匹配数据 返回值 是 存储这个数据单元的索引下标
如果没有 匹配数据 返回结果是 -1
var arr = [1,2,3,4,5,1,2,3,4,5,1,2,3,4,5];
console.log(arr); //控制台 输出 Array(15)
// 查找 3 第一次出现的位置 返回的是 第一个3 存储单元的 索引下标
console.log( arr.indexOf( 3 ) ); // 2
// 查找 3 最后一次出现的位置 返回的是 最后一个3 存储单元的 索引下标
console.log( arr.lastIndexOf( 3 ) ); // 12
// 如果没有匹配的数据 返回结果是 -1
// 查找匹配 执行的是 严格比较/全等判断 ===
console.log( arr.lastIndexOf( '3' ) ); // -1
将数组存储的数值 按照大小顺序进行排列【sort】
数组.sort()
默认 按照首字符 数值大小顺序 进行排序
首字符相同情况 按照 之后的 字符 依次排序
不是按照实际数值大小进行排序
数组.sort(function(a,b){return a-b});
按照数值大小 从 小 至 大 排续
sort() 中 定义的 参数是 一个 匿名函数
匿名函数 还要定义两个参数 两个参数名称可以任意定义
匿名函数 的返回值 return 是 参数1 - 参数2
数组.sort(function(a,b){return b-a});
按照数值大小 从 大 至 小 排续
sort() 中 定义的 参数是 一个 匿名函数
匿名函数 还要定义两个参数 两个参数名称可以任意定义
匿名函数 的返回值 return 是 参数2 - 参数1
一般只对 存储 数值的数组 进行排序
var arr = [312,6543435,432,543,956354,453,56,87,65,75436,345,423,4,32,54,88765,7654,74321,4543];
// 默认按照 首字符大小顺序排序
arr.sort();
console.log( arr );
var arr1 = [312,6543435,432,543,956354,453,56,87,65,75436,345,423,4,32,54,88765,7654,74321,4543]
// 按照数值大小 从 小 至 大 排序
arr1.sort(function(min,max){return min-max});
console.log( arr1 );
var arr2 = [312,6543435,432,543,956354,453,56,87,65,75436,345,423,4,32,54,88765,7654,74321,4543]
// 按照数值大小 从 大 至 小 排序
arr2.sort(function(min,max){return max-min});
console.log( arr2 );
数组 和 字符串 的相互转化【join】【split】
数组.join()
获取数组单元存储的数据 拼接转化为 字符串
默认获取数组单元存储的数据 以 逗号 为间隔 拼接为 字符串
在 join() 中 可以定义 间隔符号
如果不需要间隔符号 在 join() 中 设定 空字符串
字符串.split()
将 字符串 分割为 数组
默认是将 字符串作为一个整体 转化为 数组单元
在 () 中 可以设定 分割字符串的 间隔符号
分割的数据单元 没有 间隔符号
如果没有 间隔符号 还希望 将每一个字符分割为 一个 数据单元 间隔符号可以设定为 空字符串
屏蔽文章内容中的关键词
split() 方法用于把一个字符串分割成字符串数组。 (此方法不改变原始字符串。)
提示: 如果把空字符串 ("") 用作 separator,那么 stringObject 中的每个字符之间都会被分割。
语法:
string.split(separator,limit)
var arr1 = [1,2,3,4,5];
// 获取数组的数据,将数据按照设定的间隔符号 拼接为字符串
var str1 = arr1.join('');
console.log( str1 ); //数字12345
var str2 = '123456';
var arr2 = str2.split('');
console.log( arr2 ); //数组 (6) ["1", "2", "3", "4", "5", "6"]
// 屏蔽关键词
// 将 特朗普 替换为 ***
var str = '唐纳德·特朗普(Donald Trump,1946年6月14日- ),出生于美国纽约,祖籍德国巴伐利亚 [1] ,德裔美国共和党籍政治家、企业家、房地产商人、电视人 [2] ,第45任美国总统(2017年1月20日-2021年1月20日)。特朗普于1968年获得宾夕法尼亚大学沃顿商学院经济学学士学位,随后任职于父亲弗雷德·特朗普的房地产公司。1971年接管公司,从事房地产开发,投资范围逐步延伸至其他多个行业。特朗普于2015年6月以美国共和党人身份宣布参选美国总统,2016年11月9日当选美国第45任总统,2017年1月20日宣誓就职 [3] 。2020年12月,特朗普败选,连任失败 [4] 。2021年1月19日,特朗普发表告别演说 [5] 。特朗普执政期间,特朗普政府在减税、强硬贸易政策、加大外交军事布局、放松金融监管方面通过立法、签署行政令、人事任命等多个方面取得了较大进展,其中税改是其前期政绩的最大亮点 [6] 。2021年1月8日,社交媒体推特宣布,永久封禁美国现任总统特朗普的账号 [7] 。宾夕法尼亚州理海大学宣布,撤销在1988年授予特朗普的荣誉学位 [8] 。同月13日,美国国会众议院表决通过针对总统特朗普的弹劾条款,正式指控他“煽动叛乱”。特朗普成为美国历史上首位两度遭弹劾的总统 [9] 。'
// 1 按照关键词 将 字符串 分割为数组
// 结果是 存储的数据单元 中 没有 关键词 了
var arr = str.split('特朗普');
console.log(arr);
// 2 将数组拼接为 字符串
// 以 替换的内容 作为 间隔符号 拼接
var newStr = arr.join('***');
console.log(newStr);
var str="How are you doing today?";
var n=str.split(" ",3);
console.log(n);
// 打印出 ["How", "are", "you"]
删除数组中指定的数据单元【splice】
数组.splice(参数1 , 参数2 , 参数3)
参数1: 参数数组单元起始位置的索引下标
参数2: 参数数组单元 个数
也就是从哪儿开始删除 删除几个单元
参数3: 删除数组单元 的 替换内容
删除的单元作为整体 被 参数3替换
一次可以替换一个内容进入 也可以替换多个内容进入
多个内容依次定义 使用逗号间隔
以 索引下标 为 删除依据 删除数组单元
var arr = [1,2,3,4,5,6,7,8,9,10];
// 从索引是0的位置开始 删除3个数组单元
arr.splice( 0 , 3 ); //控制台输出:(7) [4, 5, 6, 7, 8, 9, 10]
// 从索引是4的位置开始 删除5个数组单元
// 将删除的5个的单元作为一个整体 使用 北京 替换
arr.splice( 4 , 5 , '北京' ); //控制台输出:(6) [1, 2, 3, 4, "北京", 10]
// 替换多个单元
arr.splice( 4 , 5 , '北京' , '上海' , '广州' , '重庆' ); //控制台输出:(9)[1, 2, 3, 4, "北京", "上海", "广州", "重庆", 10]
console.log( arr );
新增 【unshift】【push】 删除【shift】【pop】
首位新增
数组.unshift()
末位新增
数组.push()
()中定义的是新增的数据单元
新增的数据单元 可以是 一个 也可以是多个
多个新增单元之间使用逗号间隔
新增函数的执行结果返回值 是 新增单元之后 新数组的长度属性值 也就是新的单元个数
首位删除
数组.shift()
末位删除
数组.pop()
删除一次是能删除一个单元
删除单元执行结果返回值 是 删除单元存储的数据数值
// 首位新增一个
var res1 = arr.unshift(100);
console.log(res1);
// 首位新增多个
var res2 = arr.unshift(200,300,400);
console.log(res2);
// 末位新增一个
var res3 = arr.push(100);
console.log(res3);
// 末位新增多个
var res4 = arr.push(200,300,400);
console.log(res4);
//首位删除
var res5 = arr.shift();
console.log(res5);
// 末位删除
var res6 = arr.pop();
console.log(res6);
console.log(arr);
数组的反转【reverse】
将数组单元 完全反转
数组.reverse();
var arr = [1,2,3,4,5];
arr.reverse();
console.log(arr); //Array(5) 5 4 3 2 1
数组的拼接【concat】
将 多个数组 拼接到一个数组中
数组.concat(参数1,参数2,参数3....)
将 参数1 之后的数组的数据 都拼接到 参数1数组中
不会改变 参数1 数组中 存储的数据
函数的执行结果返回值 是 新的拼接后数组
可以使用变量储存
var arr1 = [1,2,3];
var arr2 = [4,5,6];
var arr3 = [7,8,9];
var arr4 = ['北京','上海','广州'];
var newArr = arr1.concat(arr2,arr3,arr4);
console.log(newArr);
控制台输出:
数组的截取【slice】
不会改变原始数值内容 执行结果返回值 是 截取的数组单元内容
数组.slice(参数1 , 参数2)
参数1: 截取起始单元的索引下标
参数2: 截取结束单元的索引下标
如果不写 是 截取到 数组的最后一个单元
var arr1 = [1,2,3,4,5,6,7,8,9];
// 从 数组索引是 3 的 位置开始截取 截取至 数组的最后一个单元
var newArr1 = arr1.slice( 3 );
console.log(newArr1);
// 从 数组索引是 3 的 位置开始截取
// 截取至 索引是 5 的 位置结束
// 但是 截取 结果 不包括 索引是5的位置的数据
var arr2 = [1,2,3,4,5,6,7,8,9];
var newArr2 = arr2.slice( 3 , 5 );
console.log(newArr2);