17-underscore库(下)
一、函数介绍
1、bind
结构
_.bind(function, object, *arguments)
说明
一个对象中所有的成员函数的this都指向这个对象
举例
_.bind(function, object, [*arguments])
var func = function(greeting){
return greeting + ': ' + this.name //this指向的是bind的第二个参数
};
var newfunc = _.bind(func, {name : 'moe'}, 'hi');
// bind返回的是一个新的function对象
2、bindAll
结构
_.bindAll(object, *methodNames)
说明
最常见的方法。作用是改变默认的function中的this指向。
举例
var buttonView = {
label : 'underscore',
onClick : function(){ alert('clicked: ' + this.label); },
onHover : function(){ console.log('hovering: ' + this.label); }
};
_.bindAll(buttonView);
jQuery('#underscore_button').bind('click', buttonView.onClick);
//当成员函数作为事件监听的时候,因为默认的事件监听,this都会指向当前事件源
//bindAll之后可以保证onClick中的this仍指向buttonView
3、once
结构
_.once(function)
说明
能确保func只调用一次,如果用func返回一个什么对象,这个对象成了单例。
举例
var initialize = _.once(createApplication);
initialize();
initialize();
4、warp
结构
_.wrap(function, wrapper)
说明
可以将函数再包裹一层,返回一个新的函数,新的函数里面可以调用原来的函数,可以将原函数的处理结果再处理一次返回
举例
var hello = function(name) { return "hello: " + name; };
//wrap返回一个新的函数
hello = _.wrap(hello, function(func) {
// 在新函数内部可以继续调用原函数
return "before, " + func("moe") + ", after";
});
hello();
5、delay
结构
_.delay(function, wait, [*arguments])
说明
在指定的wait后面执行函数与setTimeout功能一致
举例
var log = _.bind(console.log, console);
_.delay(log, 1000, 'logged later');
6、defer
结构
_.defer(function, [*arguments])
说明
也是延迟执行方法,不同的是他能保证在当前堆栈中的所有的代码跑完之后再执行function。其实就是setTimeout(fn,1);
举例
_.defer(function(){ alert('deferred'); });
7、compose
结构
_.compose(*functions)
说明
将多个函数处理过程合并,每个函数可以调用前面函数的运行结果,_.compose(func1,func2);相当于func1(func2())
举例
var greet = function(name){ return "hi: " + name; };
var exclaim = function(statement){ return statement.toUpperCase() + "!"; };
var welcome = _.compose(greet, exclaim);
welcome('moe');
8、after:
结构
_.after(count, function)
说明
创建一个新的函数,当func反复调用时,count次才调用一次
举例
function a(){
alert("a");
}
var afterA = _.after(3,a);
afterA();//调用
afterA();//不alert
afterA();//不alert
afterA();//调用
9、memoize
结构
_.memoize(function, [hashFunction])
说明
该方法可以缓存函数返回结果,如果一个函数计算需要很长的时间,多次反复计算可以只计算一次缓存结果,默认的缓存key是函数调用时的第一个参数,也可以自己定义function(第二个参数)来计算key
举例
_.memoize = function(func, hasher) {
var memo = {};//缓存存放位置
//_.indentity默认取数组第一个元素
hasher || (hasher = _.identity);
return function() {
var key = hasher.apply(this, arguments);
return _.has(memo, key) ? memo[key] : (memo[key] = func.apply(this, arguments));
};
};
二、对象方法介绍
1、keys
结构
_.keys(object)
说明
可以非常方便地返回一个object自身所有的key,但不包含从原型链继承下来的
举例
function Student(name, age) {
this.name = name;
this.age = age;
}
var xiaoming = new Student('小明', 20);
_.keys(xiaoming); // ['name', ‘age']
2、allKeys
结构
_.memoize(function, [hashFunction])
说明
除了object自身的key,还包含从原型链继承下来的
举例
function Student(name, age) {
this.name = name;
this.age = age;
}
Student.prototype.school = 'No.1 Middle School';
var xiaoming = new Student('小明', 20);
_.allKeys(xiaoming); // ['name', 'age', 'school']
3、values
结构
_.values(object)
说明
和keys()类似,values()返回object自身但不包含原型链继承的所有值
举例
var obj = {
name: '小明',
age: 20
};
_.values(obj); // ['小明', 20]
4、mapObject
结构
_.mapObject(object, iteratee, [context])
说明
就是针对object的map版本
举例
var obj = { a: 1, b: 2, c: 3 };
// 注意传入的函数签名,value在前,key在后:
_.mapObject(obj, (v, k) => 100 + v); // { a: 101, b: 102, c: 103 }
5、invert
结构
_.invert(object)
说明
把object的每个key-value来个交换,key变成value,value变成key
举例
var obj = {
Adam: 90,
Lisa: 85,
Bart: 59
};
_.invert(obj); // { '59': 'Bart', '85': 'Lisa', '90': 'Adam' }
6、extend
结构
_.extend(destination, *sources)
说明
把多个object的key-value合并到第一个object并返回
举例
var a = {name: 'Bob', age: 20};
_.extend(a, {age: 15}, {age: 88, city: 'Beijing'});
// {name: 'Bob', age: 88, city: 'Beijing'}
// 变量a的内容也改变了:
a; // {name: 'Bob', age: 88, city: ‘Beijing'}
注意:如果有相同的key,后面的object的value将覆盖前面的object的value
7、extendOwn
结构
_.extendOwn(destination, *sources)
说明
extendOwn()和extend()类似,但获取属性时忽略从原型链继承下来的属性
举例
_.pick({name: 'moe', age: 50, userid: 'moe1'}, 'name', 'age');//{name: 'moe', age: 50}
_.pick({name: 'moe', age: 50, userid: 'moe1'}, function(value, key, object) {
return _.isNumber(value);
});//{age: 50}
8、clone
结构
_.clone(object)
说明
如果我们要复制一个object对象,就可以用clone()方法,它会把原有对象的所有属性都复制到新的对象中
注意:clone()是“浅复制”。所谓“浅复制”就是说,两个对象相同的key所引用的value其实是同一对象
source.skills === copied.skills; // true
也就是说,修改source.skills会影响copied.skills。
举例
var source = {
name: '小明',
age: 20,
skills: ['JavaScript', 'CSS', 'HTML']
};
var copied = _.clone(source)
9、isEqual
结构
_.isEqual(object, other)
说明
extendOwn()和extend()类似,但获取属性时忽略从原型链继承下来的属性
举例
var o1 = { name: 'Bob', skills: { Java: 90, JavaScript: 99 }};
var o2 = { name: 'Bob', skills: { JavaScript: 99, Java: 90 }};
o1 === o2; // false
_.isEqual(o1, o2); // true
isEqual()其实对Array也可以比较
var o1 = ['Bob', { skills: ['Java', 'JavaScript'] }];
var o2 = ['Bob', { skills: ['Java', 'JavaScript'] }];
o1 === o2; // false
_.isEqual(o1, o2); // true