underscorejs-find学习

时间：2022-09-27 23:05:49

2.5 find

2.5.1 语法：

_.find(list, predicate, [context])

2.5.2 说明：

对list集合的每个成员依次进行匹配(根据predicate迭代函数检测)，匹配成功则立即返回当前成员

  • list可以为数组，对象，字符串和arguments
  • predicate会传第三个参数value, key, list(参数名可自定义)
  • predicate函数需要返回值
  • context可以改变predicate函数内部的this

2.5.3 代码示例：

示例一：find对数组，对象，字符串，arguments进行操作并返回匹配成功的数据

var result;

// 操作数组

result = _.find([1, 2, 3], function (value) {

    return value === 2;

});

console.log(result) //=> 2

// 操作对象

result = _.find({ one: '一', two: '二', three: '三' }, function (value) {

    return value === '二';

});

console.log(result) //=> "二"

// 操作复杂的对象

var obj = {

    levelA: {

        level0: 'level0',

        level1: 'level1'

    },

    levelB: '一',

    levelC: 1

}

result = _.find(obj, function (value) {

    return value.level0 === 'level0';

});

console.log(result) //=> Object {level0: "level0", level1: "level1"}

// 操作字符串(此处将字符拆分为数组)

result = _.find('123', function (value) {

    return value === '2';

});

console.log(result) //=> "2"

//操作arguments

function abc() {

    result = _.find(arguments, function (value) {

        return value === 2;

    });

    console.log(result); //=> 2

}

abc(1, 2, 3);

示例二：predicate函数传递的参数(函数内部需要return返回值，否则返回undefined)

var result;

//数组的情况

result = _.find([1, 2, 3], function (value, key, list) {

    console.log(value, key, list);

    //=> 1 0 [1, 2, 3]

    //=> 2 1 [1, 2, 3]

    //=> 3 2 [1, 2, 3]

    return true; // true为真值则直接返回第一个成员

});

//对象的情况

result = _.find({one: '一', two: '二', three: '三'}, function(value, key, list){

    console.log(value, key, list);

    //=> 一 one Object {one: "一", two: "二", three: "三"}

    //=> 二 two Object {one: "一", two: "二", three: "三"}

    //=> 三 three Object {one: "一", two: "二", three: "三"}

    return true; // true为真值则直接返回第一个成员

});

示例三：context可以改变predicate内部的this

var result;

// 数组的情况

result = _.find([1, 2, 3], function (value, key, list) {

    console.log(this); //=> [1, 2, 3] this是数组

}, [1, 2, 3]);

// 对象的情况

result = _.find([1, 2, 3], function (value, key, list) {

    console.log(this); //=> Object {no: 10} this是对象

}, { "no": 10 });

// 字符串的情况

result = _.find([1, 2, 3], function (value, key, list) {

    console.log(this); //=> String {0: "1", 1: "2", 2: "3", length: 3, [[PrimitiveValue]]: "123"} this是将字符串拆分后的对象

}, "123");

2.5.4 _.detect的功能和_.find是一样的

var result = _.detect([1, 2, 3], function (value, key, list) {

    return value === 2;

});

console.log(result) //=> 2

2.5.5 特殊情况

示例一：list的特殊情况

//例如:null,undefined,0,true,this等；

var result = _.find(null, function (value, key, list) {

    return true;

});

console.log(result) //=> "undefined"

示例二：predicate函数的this为window全局对象的情况

// 例如:null,undefined,window,this等

var result = _.find([1, 2, 3], function (value, key, list) {

    console.log(this); //=> this是window全局对象

}, null);

2.5.6 list参数可为真假值？

var  result = _.find([false, 1, true, '1', 0, undefined, null]);

console.log(result) //=> [1]

2.5.7 predicate还有其他写法？

示例一：predicate参数为空的时候

var  result = _.find({x: 1, y: 2});

console.log(result) //=> [1]

示例二：predicate参数为一个字符的时候

var  result = _.find([{x: 1}, {y: 2}], 'x');

console.log(result) //=> [{x: 1}]

示例三：predicate参数为对象的时候

var obj = [

    {x: 1, y: 2},

    {x: 1},

    {y: 2, z: 3}

]

var  result = _.find(obj, {x: 1});

console.log(result) //=> [{x: 1, y: 2}]

gitbook地址：https://www.gitbook.com/book/niec-fe/underscorejs/details

相关文章