基本方法

isArray() 判断数组

isArray() 方法用于判断是否是数组(有兼容性)

语法:Array.isArray(arr)

返回值:是数组,返回true。不是数组,返回false。

if (Array.isArray([1,2,3])) {
   // true
} else {
   // false
}

toString() 转字符串

toString() 方法可把数组转换为字符串,并返回结果。

语法:array.toString()

返回值:字符串

var arr = ['a','s','d']
var str = arr.toString()
console.log(str) // a,s,d

join() 分割

join() 方法用于把数组中的所有元素放入一个字符串。

语法:array.join(separator)

separator:可选。分割符,默认英文逗号。

返回值:字符串

var arr = ['a','s','d']
var str = arr.join()
console.log(str) // a,s,d

pop() 删除数组最后一项

pop() 方法用于删除并返回数组的最后一个元素。

语法:arrayObject.pop()

返回值:数组长度减1,并返回删除的元素的值。如果是空数组,返回undefined。

var arr = ['a','s','d']
var str = arr.pop()
console.log(str) // d
console.log(arr) // a,s

push() 数组尾部添加元素

push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。

语法:arrayObject.push(newelement1,newelement2,....,newelementX)

newelement1:必需。要添加到数组的第一个元素。

newelement2:可选。要添加到数组的第二个元素。

newelementX:可选。可添加多个元素。

返回值:新的长度

var arr = ['a','s','d']
var len = arr.push('f')
console.log(len) // 4
console.log(arr) // a,s,d,f

shift() 删除数组第一项

shift() 方法用于删除并返回数组的第一个元素。

语法:arrayObject.shift()

返回值:数组长度减1,并返回删除的元素的值。如果是空数组,返回undefined。

var arr = ['a','s','d']
var str = arr.shift()
console.log(str) // a
console.log(arr) // s,d

unshift() 数组开头添加元素

unshift() 方法可向数组的开头添加一个或多个元素,并返回新的长度。

语法:arrayObject.unshift(newelement1,newelement2,....,newelementX)

newelement1:必需。要添加到数组的第一个元素。

newelement2:可选。要添加到数组的第二个元素。

newelementX:可选。可添加多个元素。

返回值:新的长度

var arr = ['a','s','d']
var len = arr.unshift('f')
console.log(len) // 4
console.log(arr) // f,a,s,d

reverse() 颠倒数组

reverse() 方法用于颠倒数组中元素的顺序。

返回值:排序的原数组。

var arr = ['a','s','d']
arr.reverse()
console.log(arr) // d,s,a

sort() 排序

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

语法:arrayObject.sort(sortby)

sortby:可选。规定排序顺序,必须是函数。默认按字母编码顺序排序。

返回值:排序的原数组。

var arr = ['a','c','d','b']
arr.sort()
console.log(arr) // a,b,c,d

concat() 合并数组

concat() 方法用于合并两个或多个数组。

语法:arrayObject.concat(arrayX,arrayX,......,arrayX)

arrayX:必需。该参数可以是具体的值,可以是数组对象,也可以是任意多个。

返回值:返回一个新的数组。不会改变原数组。

var arr1 = ['a','b']
var arr2 = ['c','d']
var arr3 = arr1.concat(arr2)

console.log(arr1) // a,b
console.log(arr2) // c,d
console.log(arr3) // a,b,c,d

slice() 提取

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

语法:arrayObject.slice(start,end)

start:必需。规定从何处开始选取(包含)。

end:可选。规定从何处结束选取(不包含)。

返回值:返回一个新的数组。不会改变原数组。

var arr = ['a','b','c','d','e']
var newArr = arr.slice(1,3)
console.log(arr) // a,b,c,d,e
console.log(newArr) // b,c

splice() 添加、删除、替换

splice() 方法用于添加、删除、替换数组元素,返回被删除的项目。

语法:arrayObject.splice(index,howmany,item1,.....,itemX)

index:必需。整数,规定添加/删除项目的位置。

howmany:必需。要删除的项目数量。如果设置为 0,则不会删除项目。

item1,.....,itemX:可选。向数组添加/替换的新项目。

返回值:删除的数组。

// 删除元素
var arr = ['a','b','c','d','e']
arr.splice(2,1)
console.log(arr) // a,b,d,e

// 删除元素 替换新元素
var arr = ['a','b','c','d','e']
var del = arr.splice(1,1,'f')
console.log(arr) // a,f,c,d,e
console.log(del) // b

// 添加新的元素
var arr = ['a','b','c','d','e']
arr.splice(1,0,'f')
console.log(arr) // a,f,b,c,d,e

indexOf() 查找首次位置

indexOf() 方法可返回一个指定元素在数组中第一次出现的位置。

语法:Array.indexOf(item,start)

item:必须。查找的元素。

start:可选的整数参数。规定在数组中开始检索的位置。

返回值:元素在数组中的位置,如果没有搜索到则返回 -1。

var arr = ['a','c','b','c','e']
var index = arr.indexOf('c')
console.log(index) // 1

lastIndexOf() 查找最后位置

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

语法:Array.lastIndexOf(item,start)

item:必须。查找的元素。

start:可选的整数参数。规定在数组中开始检索的位置。

返回值:元素在数组中的位置,如果没有搜索到则返回 -1。

var arr = ['a','c','b','c','e']
var index = arr.lastIndexOf('c')
console.log(index) // 3

迭代数组的5种方法

every()

every()方法用于判断数组中是否每个元素都满足条件。

语法:Array.every(function(item,index,array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

返回值:只有都满足才返回true,只要有一项不满足返回false。

var arr = [1,2,3,4,5,6]
var res = arr.every(item => {
   return item > 2
})
console.log(res) // false

some()

some()用于判断数组中是否有至少一个元素满足条件。

语法:Array.some(function(item,index,array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

返回值:只要有一个满足就返回true,只有都不满足才返回false。

var arr = [1,2,3,4,5,6]
var res = arr.some(item => {
   return item > 5
})
console.log(res) // true

filter()

filter()方法用于对数组进行过滤。

语法:Array.filter(function(item, index, array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

返回值:返回符合条件的新数组,不会改变原数组。

var arr = [1,2,3,4,5,6]
var res = arr.filter(item => {
   return item > 3
})
console.log(res) // [4,5,6]

map()

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

语法:Array.map(function(item, index, array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

返回值:返回新的数组,不会改变原数组。

var arr = [1,2,3,4]
var res = arr.map(item => {
   if (item == 3) {
       return item * 2
  }
   return item
})
console.log(res) // [1,2,6,4]

forEach()

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

语法:Array.forEach(function(item, index, array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

没有返回值:如果是空数组,item为undifined。

var arr = [1,2,3,4]
var sum = 0
arr.forEach(item => {
   sum += item
})
console.log(sum) // 10

reduce()

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

reduce() 可以作为一个高阶函数,用于函数的 compose。

语法:Array.reduce(function(total, iten, index, array) { return total }, initialValue)

total:必须。计算结束后的返回值。初始值为initialValue。

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

initialValue:传递给函数的初始值。

返回值:返回计算结果。

// 计算数组项总和
var arr = [1,2,3,4]
var sum = arr.reduce((total,item) => {
   return total + item
},0)
console.log(sum) // 10

// 计算数组项最大值
var arr = [1,2,3,4]
var max = arr.reduce((total,item) => {
   return Math.max(total, item)
})
console.log(max) // 4

// 数组去重
var arr = [1,2,3,2,1,4]
var newArr = arr.reduce((total,item) => {
   total.indexOf(item) === -1 && total.push(item)
   return total
},[])
console.log(newArr) // [1,2,3,4]

ES6 新增数组方法

fill()

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

语法:Array.fill(value, start, end)

value:必需。填充的值。

start:可选。开始填充位置。

end:可选。停止填充位置。

返回值:被填充的原数组。

var arr = ['a','b','c','d']
arr.fill('e',1,3)
console.log(arr) // ['a','e','e','d']

find()

find()方法用于查找并返回符合条件的第一个数组项。

语法:Array.find(function(item, index, array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

返回值:返回符合条件的第一个数组元素值,没有符合条件返回 undefined。

var arr = ['a','b','c','d']
var str = arr.find(item => {
   return item == 'c'
})
console.log(str) // c

findIndex()

findIndex()方法用于查找并返回符合条件的第一个数组项的位置。

语法:Array.findIndex(function(item, index, array) { return 条件 })

item:必须。当前元素的值。

index:当前元素的索引。

array:当前元素的数组对象。

返回值:返回符合条件的第一个数组元素值,没有符合条件返回 -1。

var arr = ['a','b','c','d']
var index = arr.findIndex(item => {
   return item == 'c'
})
console.log(index) // 2

ES7 新增数组方法

includes()

includes() 方法用来判断一个数组是否包含一个指定的值。

语法:Array.includes(searchElement, fromIndex)

searchElement:必须。需要查找的元素值。

fromIndex:可选。从该索引处开始查找 searchElement。

返回值:包含返回true,不包含返回false。

var arr = ['a','b','c','d']
var res = arr.includes('b')
console.log(res) // true

javaScript基本使用api的更多相关文章

  1. javascript 百度地图API - demo

    <!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...

  2. 在线聊天室的实现(1)--websocket协议和javascript版的api

    前言: 大家刚学socket编程的时候, 往往以聊天室作为学习DEMO, 实现简单且上手容易. 该Demo被不同语言实现和演绎, 网上相关资料亦不胜枚举. 以至于很多技术书籍在讲解网络相关的编程时, ...

  3. 第二篇、JavaScript常用的API

    下面是我整理的一些JavaScript常用的API清单. 目录 元素查找 class操作 节点操作 属性操作 内容操作 css操作 位置大小 事件 DOM加载完毕 绑定上下文 去除空格 Ajax JS ...

  4. [Javascript] JSON.parse API

    JSON (JavaScript Object Notation) is a standard method to serialize JavaScript objects and is common ...

  5. 【转】NativeScript的工作原理:用JavaScript调用原生API实现跨平台

    原文:https://blog.csdn.net/qq_21298703/article/details/44982547 -------------------------------------- ...

  6. Javascript实现百度API

    百度地图JavaScript API是一套由JavaScript语言编写的应用程序接口,可帮助您在网站中构建功能丰富.交互性强的地图应用,支持PC端和移动端基于浏览器的地图应用开发,且支持HTML5特 ...

  7. JavaScript 对象所有API解析【2020版】

    JavaScript 对象所有API解析[2020版] 写于 2019年08月20日,虽然是2019年写的文章,但现在2020年依旧不过时,现在补充了2019年新增的ES10 Object.fromE ...

  8. 【Chrome】如何在C++中增加给JavaScript调用的API

    本文示例说明了如何在Chrome浏览器中增加JavaScript API.为了简化,先假设是在已有的namespace中增加一个新的API,文章的最后将指出如果增加一下全新的namespace所需注意 ...

  9. JavaScript原生拖放API入门总结

    一.背景 最早实现JavaScript拖放功能的是IE4的浏览器了.在当时,网页中只有图像和文本才能够进行拖放.IE5之后,拖放功能得到了扩展,形成了一个API(应用程序编程接口),使得几乎任何的标签 ...

  10. JavaScript 使用 mediaDevices API 选择摄像头

    大多数智能手机都有前置和后置摄像头,当你在创建视频应用时你可能想要选择或者切换前置.后置摄像头. 如果你开发的是一款聊天应用,你很可能会想调用前置摄像头,但如果你开发的是一款拍照软件,那么你会更倾向于 ...

随机推荐

  1. PHPstrom中关闭提示信息

    设置里面搜索parameter name hints

  2. dnSpy PE format ( Portable Executable File Format)

    Portable Executable File Format PE Format  微软官方的 What is a .PE file in the .NET framework? [closed] ...

  3. ftp配置文件详解

    ### 主配置文件(/etc/vsftpd/vsftpd.conf) 严格来说,整个 vsftpd 的配置文件就只有这个档案!这个档案的设定是以 bash的变量设定相同的方式来处理的, 也就是`参数= ...

  4. 从浏览器地址栏输入url到显示页面的步骤

      在浏览器地址栏输入URL 浏览器查看缓存,如果请求资源在缓存中并且新鲜,跳转到转码步骤 HTTP1.0提供Expires,值为一个绝对时间表示缓存新鲜日期 HTTP1.1增加了Cache-Cont ...

  5. OGG 从Oracle备库同步数据至kafka

    OGG 从Oracle备库同步数据至kafka Table of Contents 1. 目的 2. 环境及规划 3. 安装配置JDK 3.1. 安装jdk 3.2. 配置环境变量 4. 安装Data ...

  6. Tooltip 文字提示

    常用于展示鼠标 hover 时的提示信息. 基础用法 在这里我们提供 9 种不同方向的展示方式,可以通过以下完整示例来理解,选择你要的效果. 使用content属性来决定hover时的提示信息.由pl ...

  7. androidstudio导入新项目build tools不符合问题解决

    问题描述:从网上或者其他地方拷贝来完整代码导入androidstudio的时候,gradle过程显示build tools不符合 问题分析:你安装的SDK版本可能与其他人不一样,那么build的工具也 ...

  8. Redis在window上的安装

    1 Redis安装 Redis 没有官方的Windows版本,但是微软开源技术团队(Microsoft Open Tech group)开发和维护着这个 Win64 的版本. 在github上面可以下 ...

  9. OnCustomDraw

    ON_NOTIFY_REFLECT(NM_CUSTOMDRAW, &CMyListCtrl::OnNMCustomdraw) ON_NOTIFY : Comes from a child co ...

  10. 支付宝API

    1. 业务场景描述:在我们的爱旅行项目中,用户只有报名并且付款之后才能算作参加旅行团成功,因此必须提供快速便捷的支付功能:这里,我们选择了阿里的支付宝api来实现快捷支付,基于此,我们向蚂蚁金服发起申 ...