有时候,把函数作为参数可以让代码更简洁。

        var calculator = {
            calculate: function(x, y, fn) {
                return fn(x, y);
            }
        };

        var sum = function(x, y) { return x + y; },
            diff = function (x, y) { return x - y; };

        var sumResult = calculator.calculate(2, 1, sum),
            diffResult = calculator.calculate(2, 1, diff);

        alert(sumResult + " " + diffResult);

变量sum和diff代表的函数参数和calculator对象的calculate方法的前2个参数保持一致。

□ 数组的every, some, filter方法参数可以是函数

       var fruit = ["apples", "oranges", "bananas", "grapes"];

        //判断是否是字符串
        function isString(value, index, array) {
            return typeof value == "string";
        }

        //判断每个数组长度是否为1
        function isLengthOne(value, index, array) {
            return value.length === 1;
        }

        //判断是否有g开头的
        function startsWithG(value, index, array) {
            return value[0] === "g";
        }

        //过滤以a和b开头的数组元素
        function startsWithAB(value, index, array) {
            return value[0] === "a" || value[0] === "b";
        }

        var result = fruit.filter(startsWithAB);

        //打印
        alert(fruit.every(isString));//判断每个数组元素的类型
        alert(fruit.every(isLengthOne));//判断是否每个数组元素都为1
        alert(fruit.some(startsWithG));//判断是否有一些以G开头
        alert(result); //过滤结果


以上,every, some, filter方法参数大致是every(value, index, array, fn),所以自定义函数的参数必须和这前3个参数保持一致。

□ 数组的forEach, map方法参数可以是函数

※ 数组的forEach方法

        var fruit = ["apples", "oranges", "bananas", "grapes"];

        function doSth(value, index, array) {
            alert(value);
        }

        fruit.forEach(doSth);

forEach方法,只针对数组元素进行操作,不返回新的数组。

※ 数组的map方法

        var fruit = ["apples", "oranges", "bananas", "grapes"];

        function doMap(value, index, array) {
            return "i like " + value;
        }

        var result = fruit.map(doMap);
        alert(result);

map方法,不仅对数组元素操作,而且返回新的数组。

“JavaScript进阶系列”包括:

JavaScript进阶系列01,函数的声明,函数参数,函数闭包

JavaScript进阶系列02,函数作为参数以及在数组中的应用

JavaScript进阶系列03,通过硬编码、工厂模式、构造函数创建JavaScript对象

JavaScript进阶系列04,函数参数个数不确定情况下的解决方案

JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数

JavaScript进阶系列06,事件委托

JavaScript进阶系列07,鼠标事件

JavaScript进阶系列02,函数作为参数以及在数组中的应用的更多相关文章

  1. JavaScript进阶系列04,函数参数个数不确定情况下的解决方案

    本篇主要体验函数参数个数不确定情况下的一个解决方案.先来看一段使用函数作为参数进行计算的实例. var calculate = function(x, y, fn) { return fn(x, y) ...

  2. JavaScript进阶系列01,函数的声明,函数参数,函数闭包

    本篇主要体验JavaScript函数的声明.函数参数以及函数闭包. □ 函数的声明 ※ 声明全局函数 通常这样声明函数: function doSth() { alert("可以在任何时候调 ...

  3. JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数

    本篇体验JavaScript事件的基本面,包括: ■ 事件必须在页面元素加载之后起效■ 点击事件的一个简单例子■ 为元素注册多个点击事件■ 获取事件参数 ■ 跨浏览器事件处理 □ 事件必须在页面元素加 ...

  4. JavaScript进阶系列07,鼠标事件

    鼠标事件有Keydown, Keyup, Keypress,但Keypress与Keydown和Keyup不同,如果按ctrl, shift, caps lock......等修饰键,不会触发Keyp ...

  5. JavaScript进阶系列06,事件委托

    在"JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数"中已经有了一个跨浏览器的事件处理机制.现在需要使用这个 ...

  6. JavaScript进阶系列03,通过硬编码、工厂模式、构造函数创建JavaScript对象

    本篇体验通过硬编码.工厂模式.构造函数来创建JavaScript对象. □ 通过硬编码创建JavaScript对象 当需要创建一个JavaScript对象时,我们可能这样写: var person = ...

  7. JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)

    函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) {             return i1 + i2;//如果不写return返回 ...

  8. Javascript我学之三函数的参数

    本文是金旭亮老师网易云课堂的课程笔记,记录下来,以供备忘 函数的参数             对于参数值,JavaScript不会进行类型检查,任何类型的值都可以被传递给参数.             ...

  9. javascript进阶系列专题:作用域与作用域链

    字面意思,作用域是指变量和函数的作用范围,换言之,作用域决定了变量和函数的可见性和有效时间.javascript作用域是用函数来区分,与其他语言的大括号不同. for (var i=0; i<5 ...

随机推荐

  1. 使用@SpringBootApplication注解

    很多Spring Boot开发者总是使用@Configuration , @EnableAutoConfiguration 和 @ComponentScan 注解他们的main类. 由于这些注解被如此 ...

  2. PyCharm 2018实现远程调试代码

    pycharm是一个非常强大的python开发工具,现在很多代码最终在线上跑的环境都是linux,而开发环境可能还是windows下开发,这就需要经常在linux上进行调试,或者在linux对代码进行 ...

  3. TcxGrid 去除<No data to display>

  4. k8s的imagePullSecrets如何生成及使用

    如果公司的docker仓库(harbor),需要用户认证之后,才能拉取镜像. 那如何在k8s里生成这个secret呢? 这个secret如何还原呢? 在k8s的yaml文件里如何实现呢? 这里提供几个 ...

  5. linux网络管理基本命令

    1.last 显示所有用户的登录情况 2.lastlog 显示那些用户有登录过,那些用户从来没登录过 3.traceroute 探测我指定网站的路径,来跟踪路由 .如:traceroute   www ...

  6. nginx 添加https 配置

    #user nobody;worker_processes 1; #error_log logs/error.log;#error_log logs/error.log notice;#error_l ...

  7. js变量和函数声明的提升(转)

    原文:http://zha-zi.iteye.com/blog/2037026 下面的程序是什么结果? var foo = 1; function bar() { if (!foo) { var fo ...

  8. ES8之async/await学习随笔

    详细学习参考文档: 阮一峰老师的博客,覆盖知识点ES6/7/8/9,本篇学习笔记对阮老师的关于async/await文档中的知识点进行分点总结 在ES8中加入async/await新特性后,很明显带来 ...

  9. 循序渐进学.Net Core Web Api开发系列【7】:项目发布到CentOS7

    系列目录 循序渐进学.Net Core Web Api开发系列目录 本系列涉及到的源码下载地址:https://github.com/seabluescn/Blog_WebApi 一.概述 本篇讨论如 ...

  10. ARP协议详解之Gratuitous ARP(免费ARP)

    ARP协议详解之Gratuitous ARP(免费ARP) Gratuitous ARP(免费ARP) Gratuitous ARP也称为免费ARP,无故ARP.Gratuitous ARP不同于一般 ...