Array对象的方法实现(3)----Array.prototype.filter和Array.prototype.find(实现常规参数的功能)
6,Array的filter方法
//filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
//注意:1,返回一个新的数组。2,不改变原数组
//语法:arr.filter(callback[, thisArg]);
Array.prototype._filter = function(fn){
if(this === null) throw new TypeError('this is null or not defined');
let that = Object(this);
if(typeof fn !== 'function') throw new TypeError('fn is not function');
let new_arr = [];
for(let i = 0;i < that.length>>>0;i++){
fn(that[i]) && new_arr.push(that[i]);
}
return new_arr;
}
https://developer.mozilla.org:
Array.prototype.filter = function(fun /* , thisArg*/)
{
"use strict";
if (this === void 0 || this === null)
throw new TypeError();
var t = Object(this);
var len = t.length >>> 0;
if (typeof fun !== "function")
throw new TypeError();
var res = [];
var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
for (var i = 0; i < len; i++)
{
if (i in t)
{
var val = t[i];
// NOTE: Technically this should Object.defineProperty at
// the next index, as push can be affected by
// properties on Object.prototype and Array.prototype.
// But that method's new, and collisions should be
// rare, so use the more-compatible alternative.
if (fun.call(thisArg, val, i, t))
res.push(val);
}
}
return res;
};
测试:
function isBigEnough(value) {
return value >= 10;
}
console.log([12, 5, 8, 130, 44].filter(isBigEnough));//[12,130,44]
console.log([12, 5, 8, 130, 44]._filter(isBigEnough));//[12,130,44]
根据mozilla社区阅读的代码,在我实现filter的时候添加对this和fn的判断,使代码更不容易出错。
7,Array的find方法
//find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
//注意:1,返回第一个满足要求的值,否则返回undefined。2,不改变原数组
//语法:arr.find(callback[, thisArg]);
Array.prototype._find = function(fn){
if(this === null) throw new TypeError('this is null or not defined');
let that = Object(this),len = that.length>>>0;
if(typeof fn !== 'function') throw new TypeError('fn is not function');
for(let i = 0;i < len;i++){
if(fn(that[i]))return that[i] ;
}
return undefined;
}
测试1:返回数组中第一个大于15的值
function isBigEnough(element) {
return element >= 15;
}
console.log([12, 5, 8, 130, 44].find(isBigEnough));//130
console.log([12, 5, 8, 130, 44]._find(isBigEnough));//130
测试2:返回数组中第一个质数
function isPrime(element, index, array) {
var start = 2;
while (start <= Math.sqrt(element)) {
if (element % start++ < 1) {
return false;
}
}
return element > 1;
}
console.log([4, 6, 8, 12].find(isPrime)); // undefined
console.log([4, 5, 8, 12].find(isPrime)); // 5
console.log([4, 6, 8, 12]._find(isPrime)); // undefined
console.log([4, 5, 8, 12]._find(isPrime)); // 5
测试3:返回数组中name为cherries的对象
var inventory = [
{name: 'apples', quantity: 2},
{name: 'bananas', quantity: 0},
{name: 'cherries', quantity: 5}
];
function findCherries(fruit) {
return fruit.name === 'cherries';
}
console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }
console.log(inventory._find(findCherries)); // { name: 'cherries', quantity: 5 }
注意:
(1,undefined必须在遍历完没找到的情况下返回,因此是在循环外返回undefined
这两个方法通过测试,基本没有问题,目前没有回传thisArg参数处理
相关链接:
filter:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
find:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/find
其他
[我的博客,欢迎交流!](http://rattenking.gitee.io/stone/index.html)
[我的CSDN博客,欢迎交流!](https://blog.csdn.net/m0_38082783)
[微信小程序专栏](https://blog.csdn.net/column/details/18335.html)
[前端笔记专栏](https://blog.csdn.net/column/details/18321.html)
[微信小程序实现部分高德地图功能的DEMO下载](http://download.csdn.net/download/m0_38082783/10244082)
[微信小程序实现MUI的部分效果的DEMO下载](http://download.csdn.net/download/m0_38082783/10196944)
[微信小程序实现MUI的GIT项目地址](https://github.com/Rattenking/WXTUI-DEMO)
[微信小程序实例列表](http://blog.csdn.net/m0_38082783/article/details/78853722)
[前端笔记列表](http://blog.csdn.net/m0_38082783/article/details/79208205)
[游戏列表](http://blog.csdn.net/m0_38082783/article/details/79035621)
相关文章
- ActiveX控件获取不到对象属性或者方法的原因分析
- JS获取/设置iframe内对象元素、文档的几种方法
- 【PHP面向对象(OOP)编程入门教程】22.把对象串行化serialize()方法,__sleep()方法,__wakeup()方法
- HttpServletRequest和ServletRequest的区别以及HttpServletRequest对象方法的用法
- Objective-C中的NSObject对象经常使用到的方法
- 第二百五十八节,Tornado框架-逻辑处理get()方法和post()方法,初识模板语言
- 编写高质量代码改善C#程序的157个建议[正确操作字符串、使用默认转型方法、却别对待强制转换与as和is]
- Java中如何遍历Map对象的4种方法
- 当一个线程进入一个对象的一个synchronized方法后,其它线程是否可进入此对象的其它方法?
- EasyDarwin开源流媒体服务器中一种实现对作用域内new对象自动释放的方法(值得借鉴)
- EasyDarwin开源流媒体服务器中一种实现对作用域内new对象自动释放的方法(值得借鉴)
- [Java] 方法锁、对象锁和类锁的意义和区别
- js 将json字符串转换为json对象的方法解析
- Array对象的方法实现(1)----Array.prototype.push和Array.prototype.concat(实现常规参数的功能)
- Array对象的方法实现(2)----Array.prototype.every和Array.prototype.fill(实现常规参数的功能)
- Array对象的方法实现(4)----Array.prototype.findIndex和Array.prototype.forEach(实现常规参数的功能)
- Array对象的方法实现(6)----Array.prototype.indexOf(实现常规参数的功能)
- spring事务--使用aop事务代理对象调用方法示例
- Oracle自定义数据类型 2 (调用对象方法)
- jasmine.spy对象的and.returnValue方法单步调试
- Py之cx_Freeze:cx_Freeze简介(程序打包软件)、安装、使用方法、案例应用(实现机器人在线24小时智能翻译软件打包)之详细攻略
- List 集合去重合并 , 多种方法演示___关于两个List集合对象去重
- 【Groovy】MOP 元对象协议与元编程 ( 方法委托 | 正常方法调用 | 方法委托实现 | 代码示例 )
- 【Groovy】MOP 元对象协议与元编程 ( 方法注入 | 分析使用 MetaClass 进行方法注入前后 mateClass 类型变化 )
- 【Groovy】MOP 元对象协议与元编程 ( GroovyObject 接口简介 | MetaClass 简介 | 使用 GroovyObject#invokeMethod 执行类方法 )
- 【Groovy】闭包 Closure ( 闭包调用 与 call 方法关联 | 接口中定义 call() 方法 | 类中定义 call() 方法 | 代码示例 )
- 火狐浏览器提示“无法加载您的Firefox配置文件”解决方法
- DataTable.AcceptChanges方法有何用处
- c#获取基类或接口的所有继承类方法
- 开发过程是用对个简单的对象的多个简单的方法,来实现复杂的功能
- JavaScript 方法、对象