每天一篇javascript学习小结(Function对象)


Posted in Javascript onNovember 16, 2015

小编两天都没有更新文章了,小伙伴们是不是等着急了,今天开始再继续我们的《每天一篇javascript学习小结》系列文章,希望大家继续关注。

1、Function  函数调用(类似call方法)

function callSomeFunction(someFunction, someArgument){
      return someFunction(someArgument);
    }

    function add10(num){
      return num + 10;
    }
    
    var result1 = callSomeFunction(add10, 10);//调用add10 把参数10传给add10
    alert(result1);  //20
    
    function getGreeting(name){
      return "Hello, " + name;
    }
    
    var result2 = callSomeFunction(getGreeting, "Nicholas");
    alert(result2);  //Hello, Nicholas

2、函数返回函数
 

function createComparisonFunction(propertyName) {
    
      return function(object1, object2){
        var value1 = object1[propertyName];
        var value2 = object2[propertyName];
    
        if (value1 < value2){
          return -1;
        } else if (value1 > value2){
          return 1;
        } else {
          return 0;
        }
      };
    }

    var data = [{name: "Zachary", age: 28}, {name: "Nicholas", age: 29}];
    
    data.sort(createComparisonFunction("name"));//sort函数接收一个函数作为排序的参考,函数createComparisonFuntion返回了一个匿名的排序函数
    alert(data[0].name); //Nicholas
    
    data.sort(createComparisonFunction("age"));
    alert(data[0].name); //Zachary

3、apply()方法使用

function sum(num1, num2){
      return num1 + num2;
    }
    
    function callSum1(num1, num2){
      return sum.apply(this, arguments);//sum函数请求把callSum1的指针传给自己,并作计算,此时的this指向callSum1
    }
    
    function callSum2(num1, num2){
      return sum.apply(this, [num1, num2]);
    }
    
    alert(callSum1(10,10));  //20
    alert(callSum2(10,10));  //20

4、函数Arguments Caller使用

function outer(){
      inner();
    }
    
    function inner(){
      alert(inner.caller);
    }
    
    outer();
caller

//返回一个对函数的引用,该函数调用了当前函数。

5、arguments.callee.caller
 

function outer(){
      inner();
    }
    function inner(){
      alert(arguments.callee.caller);
      //argments.callee就是函数体本身,arguments.callee.caller就是函数体的调用函数体
    }
    outer();


function factorial(num){
      if (num <= 1) {
        return 1;
      } else {
        return num * arguments.callee(num-1)//callee当前函数的引用即factorial函数本身的函数体
      }
    }

    var trueFactorial = factorial;
    
    factorial = function(){
      return 0;
    };
    
    alert(trueFactorial(5));  //120
    alert(factorial(5));    //0

6、Funtion bind()方法

window.color = "red";
    var o = { color: "blue" };
              
    function sayColor(){
      alert(this.color);
    }
    var objectSayColor = sayColor.bind(o);
    objectSayColor();  //blue
    /*
      bind主要是为了改变函数内部的this指向,这个是在ECMA5以后加入的,所以IE8一下的浏览器不支持
      bind方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入bind方法的第一个参数作为this,
      传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数.
    */

7、Function call()方法

window.color = "red";
    var o = { color: "blue" };
    
    function sayColor(){
      alert(this.color);
    }
    
    sayColor();      //red
    
    sayColor.call(this);  //red 此时this指向window
    sayColor.call(window); //red 同上
    sayColor.call(o);   //blue 此时sayColor的指针指向o

 function sum(num1, num2){
      return num1 + num2;
    }
    
    function callSum(num1, num2){
      return sum.call(this, num1, num2);
    }
    
    alert(callSum(10,10));  //20

8、函数长度length

function sayName(name){
      alert(name);
    }   
    
    function sum(num1, num2){
      return num1 + num2;
    }
    
    function sayHi(){
      alert("hi");
    }
    
    alert(sayName.length); //1
    alert(sum.length);   //2
    alert(sayHi.length);  //0
    //实际返回的是函数的参数的长度

以上就是今天的javascript学习小结,之后每天还会继续更新,希望大家继续关注。

Javascript 相关文章推荐
使用Jquery来实现可以输入值的下拉选单 雏型
Dec 06 Javascript
js汉字排序问题 支持中英文混排,兼容各浏览器,包括CHROME
Dec 20 Javascript
js的隐含参数(arguments,callee,caller)使用方法
Jan 28 Javascript
浅析Javascript中“==”与“===”的区别
Dec 23 Javascript
Sort()函数的多种用法
Mar 20 Javascript
分析js闭包引起的事件注册问题
Mar 29 Javascript
基于JavaScript FileReader上传图片显示本地链接
May 27 Javascript
微信小程序 chooseImage选择图片或者拍照
Apr 07 Javascript
详解Node.js串行化流程控制
May 04 Javascript
Angular 4依赖注入学习教程之Injectable装饰器(六)
Jun 04 Javascript
bootstrap-table formatter 使用vue组件的方法
May 09 Javascript
angular *Ngif else用法详解
Dec 15 Javascript
举例讲解JavaScript中关于对象操作的相关知识
Nov 16 #Javascript
实例代码详解jquery.slides.js
Nov 16 #Javascript
jQuery实现标题有打字效果的焦点图代码
Nov 16 #Javascript
JavaScript中对DOM节点的访问、创建、修改、删除
Nov 16 #Javascript
常用javascript表单验证汇总
Jul 20 #Javascript
jquery验证邮箱格式是否正确实例讲解
Nov 16 #Javascript
跟我学习javascript的call(),apply(),bind()与回调
Nov 16 #Javascript
You might like
PHP邮件专题
2006/10/09 PHP
把1316这个数表示成两个数的和,其中一个为13的倍数,另一个是11的倍数,求这两个数。
2011/06/24 PHP
注册页面之前先验证用户名是否存在的php代码
2012/07/14 PHP
关于PHP模板Smarty的初级使用方法以及心得分享
2013/06/21 PHP
php版本的cron定时任务执行器使用实例
2014/08/19 PHP
PHP使用pear实现mail发送功能 windows环境下配置pear
2016/04/15 PHP
PHP实现数组根据某个单元字段排序操作示例
2018/08/01 PHP
javascript 匿名函数的理解(透彻版)
2010/01/28 Javascript
JavaScript内核之基本概念
2011/10/21 Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
2012/02/10 Javascript
Javascript模块化编程(三)require.js的用法及功能介绍
2013/01/17 Javascript
jQuery :first选择器使用介绍
2013/08/09 Javascript
JS动画效果打开、关闭层的实现方法
2015/05/09 Javascript
JS实现控制文本框的内容
2016/07/10 Javascript
JS实现漂亮的时间选择框效果
2016/08/20 Javascript
jQuery图片加载显示loading效果
2016/11/04 Javascript
js中Number数字数值运算后值不对的解决方法
2017/02/28 Javascript
微信小程序 下拉菜单简单实例
2017/04/13 Javascript
浅谈vuex 闲置状态重置方案
2018/01/04 Javascript
解决npm管理员身份install时出现权限的问题
2018/03/16 Javascript
React Router v4 入坑指南(小结)
2018/04/08 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
vue + element-ui的分页问题实现
2018/12/17 Javascript
vue-cli+iview项目打包上线之后图标不显示问题及解决方法
2019/10/16 Javascript
Vue动态加载图片在跨域时无法显示的问题及解决方法
2020/03/10 Javascript
[01:27]DOTA2电竞之夜 今夜共饮庆功酒
2014/08/02 DOTA
[41:52]2018DOTA2亚洲邀请赛3月29日 小组赛A组 TNC VS OpTic
2018/03/30 DOTA
Python文档生成工具pydoc使用介绍
2015/06/02 Python
Python多线程threading模块用法实例分析
2019/05/22 Python
python全栈要学什么 python全栈学习路线
2019/06/28 Python
python变量的作用域是什么
2020/05/26 Python
经理管理专业毕业自荐书范文
2014/02/12 职场文书
销售类求职信
2014/06/13 职场文书
领导班子党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
村干部四风问题整改措施
2014/09/30 职场文书
25张裸眼3D图片,带你重温童年的记忆,感受3D的魅力
2022/02/06 杂记