ES6常用数组方法及模拟实现
这里给大家分享下我搜索到的几个ES6常用数组方法及模拟实现,废话不多说,上代码

Array.from
可以将一个类数组转换成数组
在出现Array.from这个方法之前,我们转换类数组的方法:
Array.prototype.slice.call(arguments)
使用Array.form
Array.from(arguments, item => {
return item;
})
Array.prototype.findIndex
查找数组中对应的索引
let arr = [1,2,3,4,5];
const index = arr.findIndex(item => item === 1); // output:0
模拟实现findIndex
Array.prototype.findIndex = function(callback){
for(let i = 0; i<this.length; i++){
if( callback(this[i]) ){
return i;
}
}
return -1;
}
Array.prototype.find
查找数组中的某个元素 let arr = [1,2,3,4];
arr.find(item => item > 2); // output: 3
模拟实现find
Array.prototype.find = function(callback) {
for(let i = 0; i < this.length; i++){
let flag = callback(this[i]);
if(flag){
return this[i]
}
}
return undefined;
}
Array.prototype.map
map方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果 const arr = [1,2,3];
arr.map(item => item * 2) // output: [2,4,6]
模拟实现map
Array.prototype.map = function(callback) {
let newArr = [];
for(let i = 0; i < this.length; i++){
let result = callback(this[i]);
newArr.push(result);
}
return newArr;
}
注意这里提个小只是,通过map的模拟实现应该可以大致明白为什么map和foreach不能跳出循环
Array.prototype.reduce
方法对累计器和数组中的每个元素(从左到右)应用一个函数,将其简化为单个值 const arr = [2,3,4];
// output: 9
const sum = arr.reduce((sum, item) => {
sum += item;
return sum;
},0);
模拟实现reduce
Array.prototype.reduce = function(callback, initialValue){
let sum = initialValue || this[0];
if(!sum){
return;
}
for(let i = 0; i < this.length; i++){
sum = callback(sum, this[i], i , this);
}
return sum;
}
Array.prototype.some
数组中的元素,有一个满足条件,则返回true var arr = [1, 2, 3]; arr.some(item => item > 2); // output: true
模拟实现some
Array.prototype.some = function(callback) {
for(let i = 0; i < this.length; i++) {
if(callback(this[i])){
return true;
}
}
return false;
}
Array.prototype.every
数组中的所有元素都满足条件,则返回true var arr = [1, 2, 3]; arr.every(item => item > 2); // output: false
模拟实现every
Array.prototype.every = function(callback){
for(let i = 0; i < this.length; i++){
if(!callback(this[i])){
return false;
}
}
return true;
}
Array.prototype.filter
filter方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素 let arr = [1,2,3];
arr.filter(item => item > 2); // output: [3]
模拟实现filter
Array.prototype.filter = function(callback) {
let newArr = [];
for(let i = 0; i < this.length; i++){
let flag = callback(this[i]);
if(flag){
newArr.push(this[i])
}
}
return newArr;
}
如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

ES6常用数组方法及模拟实现的更多相关文章
- ES6新增的常用数组方法(forEach,map,filter,every,some)
ES6新增的常用数组方法 let arr = [1, 2, 3, 2, 1]; 一 forEach => 遍历数组 arr.forEach((v, i) => { console.log( ...
- 迟早要知道的JS系列之常用数组方法
常用数组方法 一.不会改变原始数组的方法: 即访问方法,下面的这些方法绝对不会改变调用它们的对象的值,只会返回一个新的数组或者返回一个其它的期望值. 1. concat() ** 语法:** Java ...
- js与jquery常用数组方法总结
昨天被问数组方法的时候,问到sort()方法是否会改变原来的数组.本来我猜是不会,也是这么说,马上我又觉得,知识这种东西,不确定的时候直接说不确定或不知道就好,只是凭借着不确定的猜测或者是记忆,害人害 ...
- js中常用数组方法concat join push pop slice splice shift
javascript给我们很多常用的 数组方法,极大方便了我们做程序.下面我们来介绍下常用的集中数组方法. 比如 concat() join() push() pop() unshift() shif ...
- ES6的数组方法之Array.from
首先说说什么是数组:数组在类型划分上归为Object,属于比较特殊的对象,数组的索引值类似于对象的key值. 数组的几个注意点: 1.数组的长度是可读属性,不可更改,数组的长度根据索引最大值. 2.数 ...
- JavaScript常用数组方法
JavaScript数组方法有以下这些: forEach() 方法对数组的每一个元素执行一次提供的函数. map() 方法创建一个新数组,其结果是该数组都执行一次函数,原函数保持不变. filter( ...
- 使用ES6新数组方法(象C# Lambda表达式一样写查询语句)
let people = [ {id: 1, name: "a", age: 12}, {id: 2, name: "b", age: 13}, {id: 3, ...
- es6 Array数组方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- es6常用数组操作及技巧汇总
定义数组 const array = [1, 2, 3]; // 或者 const array = new Array(); array[0] = '1'; 检测数组 Array.isArray([] ...
- javascript中常用数组方法详细讲解
javascript中数组常用方法总结 1.join()方法: Array.join()方法将数组中所以元素都转化为字符串链接在一起,返回最后生成的字符串.也可以指定可选的字符串在生成的字符串中来分隔 ...
随机推荐
- PCG——程序化地形生成(1)
前言 接触了半年多Houdini,佛系研究了一下PCG(Procedural Content Generation)相关的技术,这真是个好东西,赶在年前写个总结.Houdini 一款DCC软件,功能又 ...
- NC20313 [SDOI2008]仪仗队
题目链接 题目 题目描述 作为体育委员,C君负责这次运动会仪仗队的训练. 仪仗队是由学生组成的N * N的方阵,为了保证队伍在行进中整齐划一,C君会跟在仪仗队的左后方,根据其视线所及的学生人数来判断队 ...
- NC16611 [NOIP2009]最优贸易
题目链接 题目 题目描述 C国有n个大城市和m条道路,每条道路连接这n个城市中的某两个城市.任意两个城市之间最多只有一条道路直接相连.这m条道路中有一部分为单向通行的道路,一部分为双向通行的道路,双向 ...
- NVME(学习笔记一)—概述
NVMe概述 NVMe是一个针对基于PCIe的固态硬盘的高性能的.可扩展的主机控制器接口. NVMe的显著特征是提供多个队列来处理I/O命令.单个NVMe设备支持多达64K个I/O 队列,每个I/O队 ...
- XTW100编程器在Win10下的安装
XTW100 这是一个淘宝上卖得很多的经典编程器, 用于写入24和25系列的存储芯片. 最初使用的是stm32f103c8t6, 因为f103价格飞涨, 市面上大都换成国产的兼容mcu了, 软件和使用 ...
- Vue中data为何以函数形式返回
data为何以函数形式返回 在使用Vue构建组件化应用时,每个组件的data属性都是以函数形式返回的,这主要是在组件化实现的时候,每个实例可以维护一份被返回对象的独立的拷贝,而不是共享同一个对象的引用 ...
- 大白菜方式制作win10 PE启动U盘
说明 最近帮朋友安装下win10,用了2种制作U盘启动盘的方式.记录一下也方便大家少走弯路. 准备的工具: 1.大白菜软件 2.win10镜像 3.1个U盘,U盘容量 > 8G即可. 制作PE启 ...
- win32 - WaitForMultipleObjects的使用
创建5个线程,并无限期地打印某些内容 #include <Windows.h> #include <stdio.h> DWORD IDs[5]; DWORD WINAPI Th ...
- win32-ReadProcessMemory在x86和x64下运行
#include <iostream> #include <Windows.h> #include <winternl.h> #include <tchar. ...
- Docker实践之07-数据管理
目录 一.数据卷概述 二.创建数据卷 三.查看数据卷 四.挂载数据卷 五.删除数据卷 六.挂载主机目录或文件 七.挂载数据卷与主机目录/文件的比较 一.数据卷概述 数据卷是一个可供一个或多个容器使用的 ...