js数组方法使用详解(一)

数组是什么?

数组是一种储存多个值的数据类型
数组是由方括号包裹的多个值。其中每个值称为数组元素。
数组是一种由简单数据类型组成的复杂数据类型

创建数组的方法有:

创建数组直接量:

const arr = ['ty','liu']

构建函数法:

var arr = new Array('ewe',164,true)
new Array()
new String()
new Boolean()
new Number()
//new : 新的(new一个对象,new一个新数组)

数组的特点:

数组的第一个元素的索引是0,数组的第二个元素的索引是1,数组的最后一个元素的索引是数组负1,所以数组是有索引的

如何访问数组元素:

使用方括号访问数组元素

如何遍历数组:

可以用for 循环来作。
for of循环
array.forEach()

array.length

定义
array.length用来检测数组的长度
语法
主人是数组
参数:
length是属性,没有参数
返回值
返回新数组长度

Array.isArray()

定义
'Array.isArray()'方法用于检测是否是数组
语法

-Array.isArray(value)

-value:是要检测的值
返回值
-true : 如果是数组,返回true
-false : 如果不是数组,返回false
示例(原则:用最简单的例子呈现知识点原理)

var str = 'hrllo wolrd'
var arr = [1,2,3]
console.log(Array.isArray(str))
console.log(Array.isArray(arr))

array.push

定义
array.push将新元素添加到数组的末尾
语法

array.push(item1,item2,...,itemX)

item1:要添加的元素
item2:一次可以添加多个元素,多个元素之间用逗号隔开
返回值
返回新数组长度

示例

var arr = [1,2,3]
arr.push(4)//4
arr.push(4,5,6)//7

array.unshift()

定义
unshift将新元素添加到数组的开头,并返回新的长度。
语法

array.unshift(item1, item2, ..., itemX)

参数:
item1:要添加的元素
item2:一次可以添加多个元素
返回值
表示数组的新长度。
示例

var fruits = ["Bana", "Orae", "Ale", "Mgo"]
fruits.unshift("Len","Pineae")

array.pop()

定义
array.pop删除数组的最后一个元素,并返回该元素
语法

array.pop()

无参数
返回值
被删除的数组项
示例

var arr = [1,2,3]
var str = arr.pop()
console.log(str)

array.shift

定义
删除数组的第一个元素,并返回该元素。
语法

array.shift()

参数:
无参数
返回值
返回被删除的数组项目
示例

var arr = [1,2,3,4]
arr.shift()

array.reverse

定义
返回反转数组中元素的顺序
语法

array.reverse()

参数:
无参数
返回值
返回反转后的数组
示例

var arr =[1,2,3,4]
    arr.reverse()
    console.log(arr)

array.join

定义
将数组的所有元素连接成一个字符串
语法

array.join(separator)

参数:
要使用的分隔符,
如果省略,元素用逗号分隔
返回值
返回字符串值,数组值,由指定的分隔符分隔。
示例

var arr = ["dfdsf", "rtdf", "ardssa", "dfgre"];
var we = arr.join();

array.concat

定义
连接两个或多个数组,并返回已连接数组的副本。
语法

array1.concat(array2, array3, ..., arrayX)

参数:
要连接的数组
返回值
返回已连接的数组
示例

var arr = ["12", "33"];
var str = ["we", "3yu", "230"];
var ad = arr.concat(str);

array.indexOf

定义
在数组中搜索元素,从末尾开始,并返回其位置。
语法

array.lastIndexOf(item, start)

参数:
item : 要搜索的项目
start : 负值的给定的位置从末尾计数,然后搜索到开头
返回值
返回指定项目的位置,否则 -1
示例

var arr = ["dfdsf", "rtdf", "ardssa", "dfgre"];
var a = arr.lastIndexOf("ardssa");

array.splice

定义
从数组中添加/删除元素。
语法

array.splice(index, howmany, item1, ....., itemX)

参数:
index : 整数,指定在什么位置添加/删除项目,使用负值指定从数组末尾开始的位置。
howmany : 要删除的项目数。如果设置为 0,则不会删除任何项目。
item1, ..., itemX : 要添加到数组中的新项目。
返回值
新数组,包含删除的项目(如果有)。
示例

var arr = ["dfdsf", "rtdf", "ardssa", "dfgre"];
arr.splice(2, 0, "Lemon", "Kiwi");

array.sort

定义
对数组的元素进行排序。
语法

array.sort(compareFunction)

参数:
compareFunction:定义替代排序顺序的函数。该函数应返回负值、零值或正值,具体取决于参数,例如:

function(a, b){return a-b}

sort() 方法比较两个值时,将值发送给比较函数,根据返回的(负、零、正)值对值进行排序。
返回值
返回项目排序
示例

 var arr1 =[4,5,6,7,8,9]
 arr1.sort()
 console.log(arr1)

array.forEach()

定义
forEach() 方法按顺序为数组中的每个元素调用一次函数。
使用指定函数遍历数组
语法

array.forEach(function(currentValue, index, arr), thisValue)

function:第一个参数是第一个函数
当执行forEach()
返回值
undefined
示例

var  arr  =  [1,2,3]
arr.forEach(function(item, index, arr){
console.log(item, index, arr)
//console.log(1,0,[1,2,3])
//console.log(2,1,[1,2,3])
//console.log(3,2,[1,2,3])
})

array.map()

定义
方法使用为每个数组元素调用函数的结果创建新数组
语法

array.map(function(currentValue, index, arr), thisValue)

参数:
function: 遍历数组的函数。必须。
item: 接收数组元素的形参,必须。
index: 接收数组索引的形参,可选。
arr: 接收当前数组的形参,可选。
this: 修改函数内的this指向,默认值undefined,可选。
返回值
返回数组,包含为原始数组中的每个元素调用提供的函数的结果。
示例

let fa= []
        //map
        fa=people.map(function(item){
        return item[1] + item[0]
        })
        console.log(fa)

array.filter()

定义
方法创建数组,其中填充了所有通过测试的数组元素
语法

array.filter(function(currentValue, index, arr), thisValue)

返回值
返回符合条件的新数组
示例

ad = people.filter(function(item){
        return item[2] > 30
        })
        console.log(ad)

array.every()

定义
检查数组中的所有元素是否都通过了测试(被作为函数提供)。
语法

array.every(function(currentValue, index, arr), thisValue)

返回值
如果数组中的所有元素都通过测试,则返回 true,否则返回 false.(布尔值)
参数:
currentValue:当前元素的值。
index:当前元素的数组索引。
arr:当前元素所属的数组对象
示例

var arr1 = [1,2,3]
        var arr2 = arr1.every(function(item,index,arr){
            return item > 1
        })
        console.log(arr2)// item > 0 ervery()返回fasle

array.find()

定义
返回数组中第一个通过测试的元素的值(作为函数提供)。
语法

array.find(function(currentValue, index, arr), thisValue)

返回值
数组中的任何元素通过测试,则返回数组元素值,否则返回 undefined。
参数:
currentValue:当前元素的值。
index:当前元素的数组索引。
arr:当前元素所属的数组对象
示例

 var arr1 = [1,2,3,2]
        var arr2 = arr1.find(function(item,index,arr){
            return item === 8
        })
        console.log(arr2)

array.findIndex()

定义
返回数组中通过测试的第一个元素的索引(作为函数提供)。
语法

array.findIndex(function(currentValue, index, arr), thisValue)

返回值
如果数组中的任何元素通过测试,则返回数组元素索引,否则返回 -1。
参数:
currentValue:当前元素的值。
index:当前元素的数组索引。
arr:当前元素所属的数组对象
示例

var ages = [4, 12, 16, 20];
function checkAdult(age) {
  return age >= document.getElementById("ageToCheck").value;
}
function myFunction() {
  document.getElementById("demo").innerHTML = ages.findIndex(checkAdult);
}

array.reduce()

定义
将数组缩减为单个值。
语法

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

返回值
返回上次调用回调函数的累积结果。
参数:
total:initialValue,或函数先前返回的值。
currentValue:当前元素的值。
index:当前元素的数组索引。
arr:当前元素所属的数组对象
示例

var arr2 = arr1.reduce(function(sum,item,index,arr){
            return sum += item
        },0)
        console.log(arr2)

array.some()

定义
检查数组中的任何元素是否通过测试(作为函数提供)。
语法

array.some(function(currentValue, index, arr), thisValue)

返回值
如果数组中的任何元素通过测试,则返回 true,否则返回 false。
参数:
currentValue:当前元素的值。
index:当前元素的数组索引。
arr:当前元素所属的数组对象
示例

var arr1 = [1,2,3]
        var arr2 = arr1.some(function(item,index,arr){
            return item > 3
        })
        console.log(arr2)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,558评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,002评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,036评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,024评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,144评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,255评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,295评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,068评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,478评论 1 305
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,789评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,965评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,649评论 4 336
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,267评论 3 318
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,982评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,223评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,800评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,847评论 2 351

推荐阅读更多精彩内容

  • 首先我们得知道数组是什么?(是什么呢?_?) 数组是一种数据类型 数组可以储存不同数据类型的数据(啥都可以存哦!(...
    劳模阅读 792评论 0 21
  • 本文会先介绍所有数组方法,再详细介绍其中的reduce(引申阅读:redux中的compose函数),接着介绍in...
    zpkzpk阅读 403评论 0 1
  • 数组的排序 sort()方法排序问题。 sort()方法是Array原型链上自带的方法。 默认排序顺序是根据字符串...
    无迹落花阅读 589评论 1 0
  • 需求: js数组(Array)方法汇总 索引: 对数组方法的学习和汇总,分为三大类: 一,改变原数组的方法(10种...
    shine001阅读 1,571评论 1 37
  • 数组方法备忘单: 添加/删除元素:push(...items) —— 向尾端添加元素,pop() —— 从尾端提取...
    个人观察日记阅读 304评论 0 0