先介绍一下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函数中的高级运用的更多相关文章

  1. Javascript函数中传递带空格的参数

    通常在页面中要让某些内容点击后产 生点击事件(非页面跳转)都会使用onclick,但是这样不适于需要传递参数的情况,于是写成直接调用Javascript函数的方式:<a href=javascr ...

  2. 在JavaScript函数中使用EL表达式注意的事项

    最近在使用JSP显示从Servlet带过来的数据时,大量的使用到了EL表达式,并且有些EL表达式是在使用到JavaScript的函数时作为参数传入的,举个例子,比如下面的样子: 这个HTML标签的意思 ...

  3. JavaScript函数中的参数(arguments)

    arguments argument是JavaScript中的一个关键字,用于指向调用者传入的所有参数. function example(x){ alert(x); alert(arguments. ...

  4. javascript函数中的三个技巧【二】

    技巧二: [惰性载入函数] 因为浏览器之间的行为的差异,我们经常会在函数中包含了大量的if语句,以检查浏览器特性,解决不同浏览器的兼容问题,比如,我们最常见的为dom节点添加时间的函数 functio ...

  5. javascript函数中with的介绍

    /*js函数中with函数的用法分析定义 方便用来引用某个对象中已有的属性但是不能用来给对象添加属性 要给对象创建新的属性 必须明确的引用该对象*/代码格式with(object) statement ...

  6. javascript函数中变量重名

    <script type="text/javascript"> function fun(a){ console.log(a); // function var a=1 ...

  7. javascript函数中的三个技巧【三】

    技巧三: [函数绑定] 在javascript与DOM交互中经常需要使用函数绑定,定义一个函数然后将其绑定到特定DOM元素或集合的某个事件触发程序上,绑定函数经常和回调函数及事件处理程序一起使用,以便 ...

  8. javascript函数中的三个技巧【一】

    在学习javascript中,函数是非常重要的,现在我来谈谈对函数的理解以及在工作和用法中的一些技巧 技巧一. [作用域安全的构造函数] 构造函数其实就是一个使用new操作调用的函数 function ...

  9. 随笔:JavaScript函数中的对象----arguments

    关于arguments 调用函数时,如果需要传参,其实参数就是一个数组,在函数体的内置对象arguments可以访问这个数组,如: arguments[0]:第一个参数 arguments[1]:第二 ...

随机推荐

  1. 使用Prism6 建立 Windows 10 通用程序.

    使用Prism6 建立 Windows 10 通用程序. 目标: 使用prism6,建立Windows 通用程序项目. 1, 解决方案—添加新建项目—通用—空白应用—输入名称—确定—确定 2 ,引用上 ...

  2. 「2014-2-8」Reading a blog on the pain points of Global Variables of C language

    晚上读到一篇<C 语言全局变量那些事儿>.我先前对链接的理解不深,算是涨了一番姿势.此文吐槽的重点,是「非 static 限定的全局变量」带来的看似出人意料(实则可以被合理解释)的行为.虽 ...

  3. Java日志系统及框架分析

    最近在考虑将容器(Tomcat)内的应用日志统一成slf4j + logback,主要目的有: 快速定位应用日志输出路径,方便日志的采集: 能动态调整日志的级别,方便线上问题定位: 方便在容器层面做扩 ...

  4. mac os 体验

    苹果电脑和苹果手机不同,不需要苹果ID就可以使用. 之后依次安装xcode, visual studio code, flash player. eclipse 还没有安装成功.

  5. MySQL数据导出

    1,打开命令行窗口“运行”-->输入CMD 2,进入自己MySQL Server安装目录的bin目录(我的安装目录如下) cd C:\Program Files\MySQL\MySQL Serv ...

  6. Export GridView Data to Excel. 从GridView导出数据到Excel的奇怪问题解析

    GridView导出函数内容如下 string attachment = "attachment; filename=Contacts.xls";            Respo ...

  7. Python之*args,**kw

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #021ca1; background-color: #8e352 ...

  8. 关于STM32-MDK中preprocessor symbols解释

    preprocessor symbols 是预处理符号的意思,这里相当于宏定义,我们在使用STM32固件库时,由于固件库里面包含的是ST整个系列单片机的定义,如下图 这时在define框中可以作为一个 ...

  9. 反射实现 AOP 动态代理模式(Spring AOP 的实现 原理)

    好长时间没有用过Spring了. 突然拿起书.我都发现自己对AOP都不熟悉了. 其实AOP的意思就是面向切面编程. OO注重的是我们解决问题的方法(封装成Method),而AOP注重的是许多解决解决问 ...

  10. SQL 数据库性能问题排查

    一个项目的运行,总伴随着性能问题,系统查询过慢,如何快速查询等 下面将简单讲解一下,如何去排查及解决这些问题. 开发过程中: 1:不要绝对的三范式,适当建立冗余能够提高查询速度,不用多表关联 2:能用 ...