Day07 - Array Cardio 中文指南二
作者:©Mrlin(史密斯林)
简介:学习记录,用于记录在CSDN课程中的学习内容。
课程:30天完成30个JS原生开发项目挑战视频教程。JavaScript30 是 Wes Bos 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。
任务表
网站给了两个数组,分别为people
数组和comments
数组,如下:
1 | const people = [ |
在此两数组的基础上实现一下几个操作:
- 是否至少有一人年满
19
周岁? - 是否每一个人都年满
19
周岁? - 是否存在
id=823423
的评论? - 找到
id=823423
的评论的序列号(下标)。 - 删除
id=823423
的评论。
是否至少有一人年满19周岁?
Array.prototype.some()
- CASE
1 | let isBiggerThan10 = (element, index, array) => { |
- Syntax
1 | arr.some(callback[, thisArg]) |
Parameters
element:当前在操作的对象。
index:当前操作对象的索引。
array:在操作的数组指针。
Return value
返回true
或者false
,返回true,说明数组中有满足条件的数据存在,返回false,说明数组里面没有满足条件的数组存在。
项目源码
- 版本一:
1 | const isAdult = people.some(function(person){ |
- 版本二:
1 | const isAdult = people.some((person) => { |
- 版本三:
1 | const isAdult = people.some(person => (new Date().getFullYear() - person.year) >= 19 ); |
是否每一个人都年满19
周岁?
Array.prototype.every()
- CASE
1 | let isBigEnough = (element, index, array) => { |
- Syntax
1 | arr.every(callback) |
Parameters
Parameters
element:当前在操作的对象。
index:当前操作对象的索引。
array:在操作的数组指针。
Return value
返回true
或者false
,返回true,代表数组中所有数据都满足条件,否则,至少有一条数据不满足条件。
项目源码
1 | const everyAdult = people.every(person => (new Date().getFullYear() - person.year) >= 19); |
是否存在id=823423
的评论?
Array.prototype.find(callback)
- CASE
1 | let isBigEnough = (element) => { |
- Syntax
1 | arr.find(callback) |
Parameters
element:当前在操作的对象。
index:当前操作对象的索引。
array:在操作的数组指针。
Return value
如果有满足条件对象,返回该对象,否则返回undefined
。
项目源码
1 | const findComment = comments.find(comment => comment.id === 823423); |
找到id=823423
的评论的序列号(下标)
Array.prototype.findIndex()
- CASE
1 | let isBigEnough = (element) => { |
- Syntax
arr.findIndex(callback)
Parameters
element:当前在操作的对象。
index:当前操作对象的索引。
array:在操作的数组指针。
Return value
返回满足条件的当前对象在数组中的索引,如果找不到满足条件的对象,返回-1
。
项目源码
1 | const findCommentIndex = comments.findIndex(comment => comment.id === 823423); |
删除id=823423
的评论
Array.prototype.splice()
- CASE
在索引2的位置移除0个元素,并且插入”drum”
1 | var myFish = ['angel', 'clown', 'mandarin', 'sturgeon']; |
从索引3开始移除1个元素。
1 | var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon']; |
从索引2移除一个元素,并且插入”trumpet”
1 | var myFish = ['angel', 'clown', 'drum', 'sturgeon']; |
从索引0开始移除2个元素,并且插入”parrot”, “anemone” 和 “blue”。
1 | var myFish = ['angel', 'clown', 'trumpet', 'sturgeon']; |
从索引2开始移除所有元素
1 | var myFish = ['angel', 'clown', 'mandarin', 'sturgeon']; |
- Syntax
1 | array.splice(start) |
array.splice(start): 从索引start
开始移除后面所有的元素。
array.splice(start, deleteCount): 从索引start
元素删除deleteCount
个元素。
array.splice(start, deleteCount, item1, item2, …):从start
索引开始,删除deleteCount
个元素,然后插入item1
,item2
,…
Array.prototype.slice()
- CASE
1 | var a = ['zero', 'one', 'two', 'three']; |
- Syntax
1 | arr.slice() |
arr.slice()等价于arr.slice(0,arr.length)
arr.slice(begin)等价于arr.slice(begin,arr.length)
arr.slice(begin, end)
:创建一个新数组,将索引begin
-end
(不包含end)的元素放到新数组中并返回新数组,原数组不被修改。
项目源码 - 删除id=823423
的评论
1 | const comments = [ |
splice
会修改原数组,slice
不会改变原数组的值。