现在的位置: 首页 > web前端 > 正文

js原生map实现的方法总结

2020年02月18日 web前端 ⁄ 共 1017字 ⁄ 字号 评论关闭

js原生方法map实现

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta name="author" content="杨欣"> <title>map</title></head><body> <script> Array.prototype.my_map = function (callback) { if (!Array.isArray(this) || !this.length || typeof callback !== 'function') { return [] } else { let result = []; for (let index = 0; index < this.length; index++) { const element = this[index]; result.push(callback(element, index, this)) } return result } } let arr = [1, 2, 3, 4, 5] let res = arr.my_map((ele, i) => { return ele + 10 }) console.log(res) </script></body></html>

补充知识点

我们平时用的是已经封装好的map方法,如果让我们自己封装一个map,应该如何实现。

万变不离其宗,其实遍历数组的核心还是for循环。因此下面封装一个map方法。

思路:

1.在原型上添加一个方法2.传一个函数和this3.call 方法传的参数和封装好的map方法的参数是一样的。

Array.prototype.fakeMap = function(fn,context) {let arr = this;let temp = [];for(let i=0;i<arr.length;i++){let result = fn.call(context,arr[i],i,arr);temp.push(result);}return temp;}

以上就是本次介绍的全部相关知识点,如果大家有任何补充可以联系我们的小编。

以上就上有关js原生map实现的方法总结的全部内容,学步园全面介绍编程技术、操作系统、数据库、web前端技术等内容。

抱歉!评论已关闭.