Javascript函数中的高级运用
先介绍一下js中的高阶函数,所谓的高阶函数就是,一个函数中的参数是一个函数或者返回的是一个函数,就称为高阶函数。
js中已经提高了一下高阶函数,使用起来非常棒,当然我们也可以自己实现,我介绍几种ES5/ES6新增的数组函数。
首先是forEach,forEach它接受两个参数,第一个函数,第二个传一个this引用对象(可以不传),函数支持传3个参数第一个表示遍历的当前值,第二个为索引,第三个表示当前对象。
[1,2,4,5].forEach(function(item,index){
console.log(item,index);
})
模拟forEach的实现
Array.prototype.for = function(fn){
for(var i=0;i<this.length;i++){
fn(this[i],i);
}
};
[2,3,4,5,6].for(function(item,index){
console.log(item,index);
})
map返回处理过后的一个新数组
var arr = [1,2,3,4,5];
var a = arr.map(function(item,index){
if(index>0){
return item*index;
}
return item;
})console.log(a); //[1, 2, 6, 12, 20]
console.log(arr); //[1, 2, 3, 4, 5]
模拟实现map
var arr = [1,2,3,4,5];
Array.prototype.m = function(fn){
var arr = [];
for(var i=0;i<this.length;i++){
arr.push(fn(this[i],i,this));
}
return arr;
};
console.log(arr.m(function(item,index,thisValue){
console.log(thisValue); //[1, 2, 3, 4, 5]
if(item>3){
return item;
}
return item-1;
})) //[0, 1, 2, 4, 5]
some方法用于检测数组中的元素是否满足指定条件,如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测,如果没有满足条件的元素,则返回false。
Array.prototype.so = function(fn){
for(var i=0;i<this.length;i++){
if(fn(this[i],i,this)){
return true;
};
}
return false;
};var arr = [1,2,3,4,5,6];
console.log(arr.so(function(item){
return item>7;
}))
filter返回满足条件的值,是一个新数组。
Array.prototype.f = function(fn){
var arr = [];
for(var i=0;i<this.length;i++){
fn(this[i],i,this)&&arr.push(this[i]);
}
return arr;
};
var arr = [1,2,3,4,5,6];
console.log(arr.f(function(item){
return item<2;
}))
every检测数组所有元素是否都符合指定条件,如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
Array.prototype.ev = function(fn){
for(var i=0;i<this.length;i++){
if(!fn(this[i],i,this)){
return false;
};
}
return true;
};var arr = [1,2,3];
console.log(arr.ev(function(item){
return item>1;
}))
函数柯里化
简单来说就是某些情况下我们执行某个函数,并不需要它直接返回一些值给我们,而是再我们需要的时候它再给我们返回,这就是函数柯里化,以下是某位大牛写的。
一个 currying 的函数首先会接受一些参数,接受了这些参数之后,该函数并不会立即求值,而是继续返回另外一个函数,刚才传入的参数在函数形成的闭包中被保存起来。待到函数被真正需要求值的时候,之前传入的所有参数都会被一次性用于求值。
不完全柯里化版
var fn = (function(){
var num = 0;
return function(){
if(arguments.length===0){
return num;
}else{
for(var i=0;i<arguments.length;i+=1){
num+=arguments[i];
}
}
};
}())fn(2);
fn(2,2,2);
fn(2);
console.log(fn()); //10
柯里化版
var currying = function(fn){
var arrNum = [];
return function(){
if(arguments.length===0){
return fn.apply(this,arrNum);
}else{
[].push.apply(arrNum,arguments);
return arguments.callee;
}
};
}var count = (function(){
var num = 0;
return function(){
for(var i=0;i<arguments.length;i+=1){
num+=arguments[i];
}
return num;
};
}());var s = currying(count);
s(3);
s(3,3,3);console.log(s());
函数反柯里化unCurrying
创建一个应用范围更广的函数。使本来只有特定对象才适用的方法,扩展到更多的对象。
简单版
var obj = {
"length": 3,
"0": 1,
"1": 2,
"2": 3
};// Array.prototype.push.call(obj,3);
// console.log(obj);function push(){
var a = [].shift.call(arguments);
Array.prototype.push.apply(a,arguments);
};
push(obj,3);
push(obj,30);
push(obj,'js');
console.log(obj);
也可以这样。
var obj = {
"length": 3,
"0": 1,
"1": 2,
"2": 3
};// Array.prototype.push.call(obj,3);
// console.log(obj);Function.prototype.uncurrying = function(){
var _this = this; //Array.prototype.push
return function(){
//删除第一个,并且返回 obj
var obj = [].shift.call(arguments);
//obj调用Array.prototype.push方法,传递arguments,注意此时arguments已经没有包含obj这个参数了。
return _this.apply(obj,arguments);
};
};var push = Array.prototype.push.uncurrying();
console.log(push(obj,'666'));
console.log(obj)
push(obj,'777');
console.log(obj)
Javascript函数中的高级运用的更多相关文章
- Javascript函数中传递带空格的参数
通常在页面中要让某些内容点击后产 生点击事件(非页面跳转)都会使用onclick,但是这样不适于需要传递参数的情况,于是写成直接调用Javascript函数的方式:<a href=javascr ...
- 在JavaScript函数中使用EL表达式注意的事项
最近在使用JSP显示从Servlet带过来的数据时,大量的使用到了EL表达式,并且有些EL表达式是在使用到JavaScript的函数时作为参数传入的,举个例子,比如下面的样子: 这个HTML标签的意思 ...
- JavaScript函数中的参数(arguments)
arguments argument是JavaScript中的一个关键字,用于指向调用者传入的所有参数. function example(x){ alert(x); alert(arguments. ...
- javascript函数中的三个技巧【二】
技巧二: [惰性载入函数] 因为浏览器之间的行为的差异,我们经常会在函数中包含了大量的if语句,以检查浏览器特性,解决不同浏览器的兼容问题,比如,我们最常见的为dom节点添加时间的函数 functio ...
- javascript函数中with的介绍
/*js函数中with函数的用法分析定义 方便用来引用某个对象中已有的属性但是不能用来给对象添加属性 要给对象创建新的属性 必须明确的引用该对象*/代码格式with(object) statement ...
- javascript函数中变量重名
<script type="text/javascript"> function fun(a){ console.log(a); // function var a=1 ...
- javascript函数中的三个技巧【三】
技巧三: [函数绑定] 在javascript与DOM交互中经常需要使用函数绑定,定义一个函数然后将其绑定到特定DOM元素或集合的某个事件触发程序上,绑定函数经常和回调函数及事件处理程序一起使用,以便 ...
- javascript函数中的三个技巧【一】
在学习javascript中,函数是非常重要的,现在我来谈谈对函数的理解以及在工作和用法中的一些技巧 技巧一. [作用域安全的构造函数] 构造函数其实就是一个使用new操作调用的函数 function ...
- 随笔:JavaScript函数中的对象----arguments
关于arguments 调用函数时,如果需要传参,其实参数就是一个数组,在函数体的内置对象arguments可以访问这个数组,如: arguments[0]:第一个参数 arguments[1]:第二 ...
随机推荐
- RabbitMQ 问题记录
1. rabbitmq安装后无法运行,报错“unable to connect to node rabbit@XXXX: nodedown”. 怀疑局域网内有相同名称的计算机安装了rabbitmq,造 ...
- 运维自动化工具---Puppet
案例环境:-----------------------------------------------------------------主机 操作系统 IP地址 主要软件--------- ...
- 【C-运算符】
一.基本运算符 (1)赋值运算符:= a=2002; //将值2002赋给变量a,动作从右到左 赋值运算左边必须指向一个存储位置(变量名——指针) (2)加法.减法运算符:+.—(二元或双目运算 ...
- linux上创建ftp服务器下载文件///使用AWS服务器作为代理,下载sbt相关的包
最近觉得自己下载有些jar的速度太慢了,就在aws上下好了,然后转到我电脑上来,在aws上开了ftp服务器.结果就倒腾了一上午,作个记录,以便后面查看. 1.安装vsftpd yum -y insta ...
- 从MySQL5.7.6开始,安装MySQL提示“请键入 NET HELPMSG 3534 以获得更多的帮助”的解决办法
今天安装MySQL提示如下错误: ----------------------------------------------------------------------------------- ...
- 字符串混淆技术在.NET程序保护中的应用及如何解密被混淆的字符串
Visual Studio提供的Dotfuscator保护程序,可以对用户代码中包含的字符串进行加密.比如下面的例子,为了找到这个程序的注册算法,用.NET Reflector加载程序集后,发现代码中 ...
- Jexus 5.8.2 Beta1发布:为Asp.Net Core进入生产环境提供平台支持
Jeuxs 5.8.2beta1于7月10日正式发布. 有如下更新: 1,为FastCGI提供KEEP_CONN支持,优化FastCGI工作线程池调度算法: 2,完善反向代理的负载均衡策略,支持“随机 ...
- [.net 面向对象程序设计进阶] (9) 序列化(Serialization) (一) 二进制流序列化
[.net 面向对象程序设计进阶] (9) 序列化(Serialization) (一) 二进制流序列化 本节导读: 在.NET编程中,经常面向对象处理完以后要转换成另一种格式传输或存储,这种将对 ...
- Coding Kata - 挑战你的“底线”
Coding Kata简介 如何进行Kata练习 亲身感受 Coding Kata简介 前段时间听到一个比较有意思的概念叫做Coding Kata,今天试了一下来说说一些想法和思考.Kata是一个日语 ...
- 使用aggregate在MongoDB中查找重复的数据记录
我们知道,MongoDB属于文档型数据库,其存储的文档类型都是JSON对象.正是由于这一特性,我们在Node.js中会经常使用MongoDB进行数据的存取.但由于Node.js是异步执行的,这就导致我 ...