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()方法将数组中所以元素都转化为字符串链接在一起,返回最后生成的字符串.也可以指定可选的字符串在生成的字符串中来分隔 ...
随机推荐
- 探索C语言中的联合体与枚举:数据多面手的完美组合!
欢迎大家来到贝蒂大讲堂 养成好习惯,先赞后看哦~ 所属专栏:C语言学习 贝蒂的主页:Betty's blog 1. 联合体的定义 联合体又叫共用体,它是一种特殊的数据类型,允许您在相同的内存位置存 ...
- 从零开始学正则(七:终章),详解常用正则API与你可能不知道的正则坑
壹 ❀ 引 花了差不多半个月的晚上时间,正则入门学习也步入尾声了,当然正则的学习还将继续.不得不说学习成效非常明显,已能看懂大部分正则以及写出不太复杂的正则,比如帮组长写正则验证文件路径正确性,再如 ...
- NC16576 [NOIP2012]摆花
题目链接 题目 题目描述 小明的花店新开张,为了吸引顾客,他想在花店的门口摆上一排花,共m 盆.通过调查顾客的喜好,小明列出了顾客最喜欢的n 种花,从1 到n 标号.为了在门口展出更多种花,规定第i ...
- Python中`yield`关键字详解
Python中`yield`关键字有什么用? Python中yield关键字有什么用? 它能做什么? 例如,我试图理解这段代码1: def _get_child_candidates(self, di ...
- OCR 03: PaddleOCR
Catalog OCR 01: EasyOCR OCR 02: Tesseract-OCR OCR 03: PaddleOCR About Git repository https://github. ...
- P1481魔族密码 题解(字典树)
魔族密码 题目背景 风之子刚走进他的考场,就-- 花花:当当当当~~偶是魅力女皇--花花!!^^(华丽出场,礼炮,鲜花) 风之子:我呕--(杀死人的眼神)快说题目!否则---_-### 题目描述 花花 ...
- RK3568开发笔记(八):开发板烧写buildroot固件(支持hdmi屏),搭建Qt交叉编译开发环境,编译一个Demo,目标板运行Demo测试
前言 前面发现开发板用ubuntu固件发现空间不够,本篇使用buildroot固件,来实现目标板运行qt界面应用. 烧写buildroot固件 这部分更详细的参照<RK3568开发笔 ...
- ContentType组件表使用
https://www.shuzhiduo.com/A/qVdepN2r5P/
- 【LeetCode链表#7】设计一个链表并实现常见的操作方法
设计链表 题目 力扣题目链接 设计链表的实现.您可以选择使用单链表或双链表.单链表中的节点应该具有两个属性:val 和 next.val 是当前节点的值,next 是指向下一个节点的指针/引用.如果要 ...
- 04、RS232 协议介绍
从之前的学习,我们知道了 SECS-I 使用的 RS232 来进行数据的传输,那我们也初略的了解下 RS232. 这一篇不用看也可以. 这是最低的协议层.它定义了设备上的物理接口.它是基于RS-232 ...