数组类型方法

2023-11-06

数组类型方法

1.concat,创建一个新数组,将array与任何数组 或 值连接在一起。

let arr = ['1','2','3','4']
let arr2 = ['9']
let arr3 = arr.concat(arr2)
console.log(arr3);
//[ '1', '2', '3', '4', '9' ]

2.pop,删除数组的最后一个元素,返回值为最后一个元素

let arr = ['1','2','3','4']
var a = arr.pop();
console.log(a);// 4

3.shift,删除数组的第一个元素,返回值为第一个元素

let arr = ['1','2','3','4']
var a = arr.shift();
console.log(a);// 1

4.splice,将数组中指定位置的数据替换为输入的数据,返回值为替换掉的元素。在数组中的位置(起始位置),要替换的个数,替换的数值

let arr = ['1','2','3','4']
var a3=arr.splice(1,1,"789")
console.log(a3) // [ '2' ]
console.log(arr)// [ '1', '789', '3' ]

5.join,数据的链接符,返回值为用输入的连接符链接后的数组元素,类型为string

let arr = ['1','2','3','4']
var a5=arr.join("-");
console.log(a5);//1-2-3-4
console.log(arr);//[ '1', '2', '3', '4' ]

6.push,在数组的最后面添加一个数据,返回值为数组最终的长度

var a6=arr.push("789");    //在数组的最后面添加一个数据,返回值为数组最终的长度。
console.log(a6);// 5
console.log(arr);// [ '1', '2', '3', '4', '789' ]

7.unshift,在数组的最开始添加一个数据,返回值为数据的最终长度

let arr = ['1','2','3','4']
var a7=arr.unshift("123");     //在数组的最开始添加一个数据,返回值为数据的最终长度。
console.log(a7);//5
console.log(arr);//[ '123', '1', '2', '3', '4' ]

8.reverse,将数组的元素倒序排列,返回值为倒序后的数组,原数组也被倒叙

let arr = ['1','2','3','4']
var a8=arr.reverse();       //将数组的元素倒序排列,返回值为倒序后的数组,原数组也被倒叙。
console.log(a8);//[ '4', '3', '2', '1' ]
console.log(arr);//[ '4', '3', '2', '1' ]

9.valueOf,toString,一般的数组的方法为打印数组的内容

console.log(arr.valueOf());       //[ '1', '2', '3', '4' ]
console.log(arr.toString());    //1,2,3,4

10.sort(),方法用于对数组的元素进行排序。

我们将创建一个数组,并按字母顺序进行排序:
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
document.write(arr.sort())

George,John,Thomas,James,Adrew,Martin
Adrew,George,James,John,Martin,Thomas
//来自w3school
我们将创建一个数组,并按数字大小顺序进行排序:
function sortNumber(a,b)
{
return a - b
}
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(arr.sort())

10,5,40,25,1000,1
1,5,10,25,40,1000
//来自w3school

11.forEach,循环遍历数组

carsList.forEach(item => {
    for(var i=0;i<item.product_list.length;i++){
        let data ={
            user_id:localStorage.user_id,
            shop_cart_id:item.shop_cart_id,
            index:item.product_list[i].index
        }
        delinfo.push(data)
    }
})
forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

注意: forEach() 对于空数组是不会执行回调函数的。

12.map 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意: map() 不会对空数组进行检测。

注意: map() 不会改变原始数组。
const users=res.items.map(item => ({
    url: item.html_url,      
    img: item.avatar_url,      
    name: item.login,
    })
);
let arr = ['1','2','3','4']
function sum(num){
  return num * 5
}
let a8 = arr.map(sum)
console.log(a8);//[ 5, 10, 15, 20 ]

13.copyWithin,方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

array.copyWithin(target, start, end)
target	必需。复制到指定目标索引位置。
start	可选。元素复制的起始位置。
end	可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
var fruits = ["1", "2", "3", "4", "5", "6"];
fruits.copyWithin(2,1,3);

1,2,2,3,5,6

14.entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)

let arra = ['a','b','c','d'];
arra.entries();

[0, "a"]
[1, "b"]
[2, "c"]
[3, "d"]

15.every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
every() 方法使用指定函数检测数组中的所有元素:
如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
如果所有元素都满足条件,则返回 true。
注意: every() 不会对空数组进行检测。
注意: every() 不会改变原始数组。
var ages = [32, 33, 16, 40];
function checkAdult(age) {
    return age >= 18;
}
let flag = ages.every(checkAdult);
console.log(flag) //false

16.fill(),方法用于将一个固定值替换数组的元素。

array.fill(value, start, end)
value	必需。填充的值。
start	可选。开始填充位置。
end	可选。停止填充位置 (默认为 array.length)
let arra = ['a','b','c','d'];
arra.fill("a");
a,a,a,a
fruits.fill("e", 2, 4);
a,b,e,e

17.filter(),方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

var ages = [32, 33, 16, 40];
function checkAdult(age) {
    return age >= 18;
}
let arr = ages.filter(checkAdult);
console.log(arr) //32,33,40

let goodsList = this.goodsList.filter(item=>item.checked === true)

18.find(),方法返回通过测试(函数内判断)的数组的第一个元素的值。

find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。
find() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
如果没有符合条件的元素返回 undefined
注意: find() 对于空数组,函数是不会执行的。
注意: find() 并没有改变数组的原始值。
var ages = [32, 33, 16, 40];
function checkAdult(age) {
    return age >= 18;
}
let arr = ages.find(checkAdult);
console.log(arr) //32

19.findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。

findIndex() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1
注意: findIndex() 对于空数组,函数是不会执行的。
注意: findIndex() 并没有改变数组的原始值。
var ages = [32, 33, 16, 40];
function checkAdult(age) {
    return age >= 18;
}
let arr = ages.findIndex(checkAdult);
console.log(arr) //0

20.from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。

from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。
如果对象是数组返回 true,否则返回 false。
Array.from(object, mapFunction, thisValue)
object	必需,要转换为数组的对象。
mapFunction	可选,数组中每个元素要调用的函数。
thisValue	可选,映射函数(mapFunction)中的 this 对象。
var setObj = new Set(["a", "b", "c"]);
var objArr = Array.from(setObj);
objArr[1] == "b"; 
console.log(objArr[1] == "b");
console.log(objArr);
//true
//[ 'a', 'b', 'c' ]

21.includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

arr.includes(searchElement)
arr.includes(searchElement, fromIndex)
searchElement	必须。需要查找的元素值。
fromIndex	可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true

22.indexOf() 方法可返回数组中某个指定的元素位置。

该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。
如果在数组中没找到指定元素则返回 -1。
array.indexOf(item,start)
tem	必须。查找的元素。
start	可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。
var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.indexOf("Apple",4);
//6

23.isArray() 方法用于判断一个对象是否为数组。

如果对象是数组返回 true,否则返回 false。
Array.isArray(obj)

24.lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。

如果要检索的元素没有出现,则该方法返回 -1。
该方法将从尾到头地检索数组中指定元素 item。开始检索的位置在数组的 start 处或数组的结尾(没有指定 start 参数时)。如果找到一个 item,则返回 item 从尾向前检索第一个次出现在数组的位置。数组的索引开始位置是从 0 开始的。
如果在数组中没找到指定元素则返回 -1。

array.lastIndexOf(item,start)
item	必需。规定需检索的字符串值。
start	可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。
var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.lastIndexOf("Apple");
//6

var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.lastIndexOf("Apple",4);
//2

25.reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

function(total,currentValue, index,arr)	必需。用于执行每个数组元素的函数。
函数参数:
参数	描述
total	必需。初始值, 或者计算结束后的返回值。
currentValue	必需。当前元素
currentIndex	可选。当前元素的索引
arr	可选。当前元素所属的数组对象。
initialValue	可选。传递给函数的初始值
var ages = [32, 33, 16, 40];
function getSum(total, num) {
  return total + num;
}
let sum = ages.reduce(getSum);
console.log(sum); //121

26.reduceRight() 方法的功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。

array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
function(total,currentValue, index,arr)
total	必需。初始值, 或者计算结束后的返回值。
currentValue	必需。当前元素
currentIndex	可选。当前元素的索引
arr	可选。当前元素所属的数组对象。
initialValue	可选。传递给函数的初始值

27.slice() 方法可从已有的数组中返回选定的元素。

//slice()方法可提取字符串的某个部分,并以新的字符串返回被提取的部分
//注意: slice() 方法不会改变原始数组。
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1,3);
//Orange,Lemon
//返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。
参数	描述
start	可选。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
end	可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

28.some() 方法用于检测数组中的元素是否满足指定条件(函数提供)

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。
some() 方法会依次执行数组的每个元素:
如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
如果没有满足条件的元素,则返回false。
注意: some() 不会对空数组进行检测。
注意: some() 不会改变原始数组。
var ages = [3, 10, 18, 20];

function checkAdult(age) {
    return age >= 18;
}
let arr = ages.some(checkAdult);
//true
参数	描述
function(currentValue, index,arr)	必须。函数,数组中的每个元素都会执行这个函数
函数参数:
参数	描述
currentValue	必须。当前元素的值
index	可选。当前元素的索引值
arr	可选。当前元素属于的数组对象
thisValue	可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

数组类型方法 的相关文章

  • HTML 属性不带引号?

    我一直认为html的属性中需要引号 div class service definition or div class service definition 但最近我注意到 w3 验证器不会将以下内容识别为错误 div class serv
  • Perl:HTTP::微小删除留下损坏的锚标记

    我编写了一个脚本 该脚本收集从数据库读取的缓冲区内的所有 URL 检查该页面是否仍然存在 并使用 HTTP Tiny 从缓冲区中删除 URL 如果该 URL 无法访问或返回无效 问题是 HTTP Tiny 删除左锚标记 例如此处无效的文本
  • 淘汰赛绑定,每个都可进行自定义

    我这里有一个情况 用于淘汰每个带有定制的绑定 这是我的代码 div div table tbody tr td td td td tr tbody table div div
  • 为什么将 x 和 y 设置为 0 时 svg 文本会消失?

    我刚刚开始阅读有关svg我提出了以下问题 我正在创建一个简单的svg with a text里面如下图所示 从我的阅读中我了解到x and y of the text标签声明文本在标签内的位置svg space 为什么当我同时设置x and
  • 如何检测元素内容何时发生变化

    我正在寻找一种方法来监视元素内动态填充 无页面重新加载 内容 以便我可以将类添加到另一个元素 到目前为止我有这个 HTML div class message container div class messages error span
  • 元素和 svg 形状之间的白线

    大家好 我正在使用由 shapedivider 生成的 svg 整形器 您可以看到 有一条白线 我不知道为什么它在那里以及如何删除它 请你帮助我好吗 有形状分隔符的代码 custom shape divider bottom 1640714
  • 如何在表格列标题处垂直旋转文本

    我用过这个数据表 http www datatables net 在我的网页上 这是fiddle http jsfiddle net fxju7 2 链接我放置代码的地方 我想要 第一个数字第二个数字列应该垂直旋转 我已经做到了 但是 问题
  • 更改

    标签中一个单词的颜色

    我正在处理一份 html 文档 并且只想在我的文档中创建一个单词 p 标记不同的颜色 如果不做完全不同的事情 这可能吗 p p tag p p I want to make only THIS word blue p p style dis
  • 我可以从命令行打印 html 文件(带有图像、css)吗?

    我想从脚本中打印带有图像的样式化 html 页面 谁能建议一个开源解决方案 我使用的是 Linux Ubuntu 8 04 但也对其他操作系统的解决方案感兴趣 你可以给html2ps http user it uu se jan html2
  • 通过 jQuery 选择动态 HTML 元素

    我正在构建一个 ASP NET MVC 应用程序 并且正在使用jQuery Blueimp https github com blueimp jQuery File Upload动态添加到页面的 PartialView 上的插件 根据插件的
  • HTML:如何强制链接在新选项卡而不是新窗口中打开[重复]

    这个问题在这里已经有答案了 I use target blank 在新选项卡中打开链接 但在 IE 中它会打开一个新窗口 这是完全合乎逻辑的 因为这就是 blank应该做的 我不知道如何target blank 在其他浏览器中的行为 有什么
  • Django:使用条件 {% extends %} 使 {% block "div" %} 成为条件

    我想分享一个 AJAX 和常规 HTTP 调用之间的模板 唯一的区别是一个模板需要扩展 base html html 而另一个则不需要 我可以用 extends request is ajax yesno app base ajax htm
  • 位图内存不足错误

    我对这个错误有疑问 我从 URL 制作网站图标解析器 我这样做是这样的 public class GrabIconsFromWebPage public static String replaceUrl String url StringB
  • 在随机位置启动 HTML5

    我有一个大约 2 小时长的音轨 我想在我的网站上使用它 我希望它在页面加载时在随机位置开始播放曲目 使用 HTML5 可以吗 我知道您可以使用 element currentTime 函数来获取当前位置 但是如何在完全下载之前获取曲目的总时
  • 水平滚动的表格上的“粘性”标题......完全不可能?

    经过过去几个小时的研究后 我开始认为这是不可能的 即使在最新的浏览器上也是如此 HTML table具有水平滚动的元素 带有 粘性 thead在顶部 作为垂直滚动的周围网页的一部分 这是我的尝试 a height 100px backgro
  • 我怎样才能让这个脚本在 WordPress 上运行?

    我有这个脚本 document ready function text1 click function this hide 代码html div class div1 p class text1 text to appear when th
  • 使用 HTML5(数据列表)自动完成功能和“包含”方法,而不仅仅是“开头为”

    我找不到它 但我又不知道如何搜索它 我想用
  • HTML 代码中的 PHP [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我用 HTML 代码编写了 PHP div div 但这出现在输出页面中 else print 我怎样才能让PHP执行 你的文件有一个 p
  • 如何使整个跨度落入新行?

    这个片段显示了我想要的 http jsfiddle net 945Df 3 http jsfiddle net 945Df 3 div class sup strong a href Rosario Santa Fe Argentina a
  • CSS 精灵按钮

    这些精灵按钮让我抓狂 我几乎可以让他们工作 但不完全是 我正在玩这个非常简单的精灵图像 我有一个 jsfiddle 项目 gt gt 这里 如果你想看的话 但如果你只想看一下 代码就在下面 http jsfiddle net jp2code

随机推荐

  • Charles设置代理后,手机无法上网

    要抓手机app的包 手机配置好代理后 能连接到Charles 但是手机无法上网 原因 Charles开启了White list 解决方式 关闭White List Tools gt White List 实现charles抓取手机访问 ht
  • 解决“您一次只能安装一种 Adobe 产品”问题

    由于dreamweaver不慎升级导致不能用 故准备卸载了重新安装 可是卸载之后一直装不上 总是提示 您一次只能安装一种 Adobe 产品 用优化大师等软件卸载清除注册表信息都不行 搜索后发现一款很好的软件 Windows Installe
  • Python变量类型的强制转换

    当我们需要对数据的类型转换时 只需要将数据类型作为函数名即可 下面给出的函数可以执行数据类型之间的转换 函数返回一个新的对象 表示转换的值 函数格式 使用示例 描述 int x base int 8 可以转换的包括String类型和其他数字
  • 《C++API设计》阅读笔记1

    1 API简介 API Application Programing Interface 提供了对某个问题的抽象 以及客户与解决改问题的软件组件之间进行交互的方式 组件本身通常以软件类库形式分发 它们可以在多个应用程序中使用 概括说 API
  • ROS机器人构建和深度学习应用

    机器人操作系统是机器人研究和公司建模 模拟和原型机器人使用最广泛的软件框架之一 将您的 ROS 知识应用于实际机器人技术比人们意识到的要困难得多 但是这个标题将立即为您提供创建自己的机器人技术所需的一切 包含超过 14 个 ROS 机器人项
  • python中input()函数详解

    1 input 函数赋值后数据在python内部的类型 if name main a input print type a b input print type b c a b print c print type c 输入及输出 从结果可
  • 解决Anaconda环境未激活的warning

    在cmd内键入python之后会报Warning 显示Anaconda环境未激活 使用如下命令激活 conda activate base 这里base指环境名 默认为base 查看环境名可以用如下命令 conda info envs
  • Oracle常见问题定位方法

    Oracle在安装时无法正常显示出安装界面 现象 在vnc的界面中 安装时提示 Can t connect to X11 window server using 1 0 as the value of the DISPLAY variabl
  • 使用注解开发springmvc

    第三步 pom xml文件引入相关依赖 主要有Spring框架核心库 Spring MVC servlet JSTL等 第四步 配置web xml 映射路径 不要为 会404 第六步 创建Controller RequestMapping
  • 某宝滑块ua特征研究

    从137版本开始某宝新加了x 82类型滑块 和之前无感或者滑动验证js 类似 不过浏览器特征检测 反调试干扰都增加了不少 变得更有难度 下面稍微讲下研究过程 首先处理大量三目运算符 这个没啥好办法 博主用ast处理的 类似下面这种 单步调试
  • 贪心算法求解TSP问题(python)

    这里使用贪心算法求解TSP问题的python版本 dist 为距离矩阵 start index 为起始位置 def tsp quick dist list start index int sum distance seq result n
  • 用C++做一颗会跳动的爱心

    先来看看效果 程序描述 程序先以较慢的速度画一个大爱心 之后跳动的心其实从视觉上看就是一大一小两个心相互切换 但是要调整一下大小爱心变化时的时间间隔 代码主要是通过设置两个函数 利用cls来清屏 重复打印大心和小心 并设置颜色为红色 详细代
  • php公众号获取code,微信公众号获取code

    methods getCode 非静默授权 第一次有弹框 this code var local window location href 获取页面url var appid wx65adcf075369 this code this ge
  • 使用LFM(Latent factor model)隐语义模型进行Top-N推荐

    最近在拜读项亮博士的 推荐系统实践 系统的学习一下推荐系统的相关知识 今天学习了其中的隐语义模型在Top N推荐中的应用 在此做一个总结 隐语义模型LFM和LSI LDA Topic Model其实都属于隐含语义分析技术 是一类概念 他们在
  • Windows 下如何安装配置Snort视频教程

    Windows 下如何安装配置Snort视频教程 第一步 http www tudou com programs view UUbIQCng360 第二部 http www tudou com programs view NqcPETQk2
  • 【算法】算法学习三:递归算法 & 栈

    文章目录 一 递归的含义 二 基线条件和递归条件 三 栈 3 1 什么是栈 3 2 调用栈 3 3 递归调用栈 一 递归的含义 递归算法是一种解决问题的方法 其中函数在执行过程中调用自身 它通过将一个大问题拆分成一个或多个相似的子问题 并逐
  • 数据倾斜2

    数据倾斜的原因和解决方案 MapReduce简介 MapReduce是面向大数据并行处理的计算模型 框架和平台 它隐含了以下三层含义 1 MapReduce是一个基于集群的高性能并行计算平台 Cluster Infrastructure 它
  • 文件上传到Linux服务器常用方法

    本文介绍几种常见的方法 把文件上传到Linux服务器中 常见有使用 scp命令 xshell软件里的xftp程序 U盘挂载 服务器自带的lrzsz程序 一 scp使用说明 1 把本机的文件传给目的服务器 linux linux scp ge
  • 修改Windows的git bash的主题(样式)

    背景 Windows的git bash页面默认是黑白的 如何改成别的颜色 PS 我一直不太喜欢黑色主题的软件 有几个原因 大多软件是白色的 看久了黑色切换到其他软件的时候眼睛不适应 字体等对比不强 我真的不知道为啥这么多人喜欢IDEA黑色主
  • 数组类型方法

    数组类型方法 1 concat 创建一个新数组 将array与任何数组 或 值连接在一起 let arr 1 2 3 4 let arr2 9 let arr3 arr concat arr2 console log arr3 1 2 3