每天一篇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 相关文章推荐
json的定义、标准格式及json字符串检验
May 11 Javascript
IE下通过a实现location.href 获取referer的值
Sep 04 Javascript
html的DOM中Event对象onabort事件用法实例
Jan 21 Javascript
js过滤HTML标签完整实例
Nov 26 Javascript
js仿小米官网图片轮播特效
Sep 29 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
Dec 08 Javascript
jquery实现表单获取短信验证码代码
Mar 13 Javascript
Node.JS使用Sequelize操作MySQL的示例代码
Oct 09 Javascript
JavaScript数据结构之单链表和循环链表
Nov 28 Javascript
原生js调用json方法总结
Feb 22 Javascript
详解基于Vue cli生成的Vue项目的webpack4升级
Jun 19 Javascript
Vue分页器实现原理详解
Jun 28 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
受疫情影响 动画《Re从零开始的异世界生活》第二季延期至7月
2020/03/10 日漫
提升PHP速度全攻略
2006/10/09 PHP
PHP获取数组中某元素的位置及array_keys函数应用
2013/01/29 PHP
php使用百度ping服务代码实例
2014/06/19 PHP
php cookie名使用点号(句号)会被转换
2014/10/23 PHP
ThinkPHP中session函数详解
2016/09/14 PHP
jQuery EasyUI API 中文文档 - ProgressBar 进度条
2011/09/29 Javascript
jQuery语法总结和注意事项小结
2012/11/11 Javascript
jquery提交form表单时禁止重复提交的方法
2014/02/13 Javascript
Javascript中的Array数组对象详谈
2014/03/03 Javascript
基于javascript实现最简单的选项卡切换效果
2016/05/16 Javascript
使用JavaScriptCore实现OC和JS交互详解
2017/03/28 Javascript
微信小程序 滚动到某个位置添加class效果实现代码
2017/04/19 Javascript
vue项目中应用ueditor自定义上传按钮功能
2018/04/27 Javascript
vue2.0项目实现路由跳转的方法详解
2018/06/21 Javascript
jQuery实现的简单拖拽功能示例【测试可用】
2018/08/14 jQuery
5分钟快速掌握JS中var、let和const的异同
2018/09/19 Javascript
微信小程序利用Canvas绘制图片和竖排文字详解
2019/06/25 Javascript
vue新建项目并配置标准路由过程解析
2019/12/09 Javascript
vue数据响应式原理知识点总结
2020/02/16 Javascript
js和jquery判断数据类型的4种方法总结
2020/08/28 jQuery
Nest.js散列与加密实例详解
2021/02/24 Javascript
Python使用urllib2模块实现断点续传下载的方法
2015/06/17 Python
python matplotlib画图库学习绘制常用的图
2019/03/19 Python
详解Python数据可视化编程 - 词云生成并保存(jieba+WordCloud)
2019/03/26 Python
一款利用html5和css3动画排列人物头像的实例演示
2014/12/05 HTML / CSS
Meli Melo官网:名媛们钟爱的英国奢侈手包品牌
2017/04/17 全球购物
澳大利亚领先的在线礼品网站:Gifts Australia
2020/08/15 全球购物
哪些情况下不应该使用索引
2015/07/20 面试题
应用数学专业求职信
2014/03/14 职场文书
高中毕业生登记表自我鉴定范文
2014/03/18 职场文书
党员民主生活会对照检查材料思想汇报
2014/09/28 职场文书
2015年中秋晚会主持词
2015/07/01 职场文书
党校团干班培训心得体会
2016/01/06 职场文书
初中数学教学反思范文
2016/02/17 职场文书
vue实现input输入模糊查询的三种方式
2022/08/14 Vue.js