详细分析JavaScript函数定义


Posted in Javascript onJuly 16, 2015

函数

几个要点:

                a).函数是javascript中的一等公民 (重要性)
                b).函数是一个对象
                c).函数定义了一个独立的变量作用域

定义方式

a)命名函数:

          除非在另一个函数内部定义,否则,命名函数是全局的。 

// 全局的命名函数
  function add(x, y) {
    return x + y;
  }
  console.info(add(100, 200));  //300

b)匿名函数:   

            匿名函数通常赋值给一个变量,再通过变量调用。

var func = function (x, y) {
      return x + y;
    }
    console.info(func(5, 2)); //7

            匿名函数适用于以下这种 “立即执行的匿名函数” 的情况:

console.info(
      function (x, y) {
            return x + y;
          }(100, 200)  //立即调用
        );

C)定义方式影响代码执行效果

                命名函数可以先使用,再定义

console.info(sum(10, 10));
    function sum(num1, num2) {
      return num1 + num2;
    }

              匿名函数必须先定义,再使用

//console.info(sumFunc(10, 10));  //Uncaught TypeError: Property 'sumFunc' of object [object Object] is not a function 
    var sumFunc = function (num1, num2) {
      return num1 + num2;
    };
    console.info(sumFunc(10, 10));

函数返回值:

                 用return 生成返回值.如没有return ,则函数返回undefined

function func() {
 }
 console.info(func()); //undefined
 function func2() {
   return; //空的返回语句
 }
 console.info(func2()); //undefined

return里藏着的坑:

var func = function (x, y) {
   var sum = x + y;
   return {
     value : sum
   }
 }

                   这么写没有问题:   调用 func(5,5)    返回的是 Object {value: 10}

                   然而: 

var func = function (x, y) {
    var sum = x + y;
    return
    {
      value: sum
    };
  }
  console.info(func(5,5)); //undefined

                   return 后面跟着个回车换行的话,
                   调用 func(5,5)    显示的是 undefined
                   编辑器帮我们在return后加了个分号;   然而在这情况下并没有什么卵用。

函数即对象:

function add(x, y) {
    return x + y;
  }
  console.info(add(100, 200)); //300
  var other = add; //other和add引用同一函数对象
  console.info(other(300, 400)); //700
  console.info(typeof other);  //function
  console.info(add === other); //true

嵌套定义的函数:

                  在函数内部,可以定义另一个函数。

function outerFunc(a, b) {
    function innerFunc(x) {
      return x * x;
    }
    return Math.sqrt(innerFunc(a) + innerFunc(b));
  }
  console.info(outerFunc(3, 4)); //5

访问外部变量:

             内部函数可以访问外部的变量与参数。

var globalStr = 'globalStr';
 function outerFunc2(argu) {
   var localVar = 100;
   function innerFunc2() {
     localVar++;
     console.info(argu + ":" + localVar + ":" + globalStr);
   }
   innerFunc2(); //hello:101:globalStr
 }
 outerFunc2("hello");

返回函数的函数:

               因为函数是对象,所以可以作为返回值。

function outerFunc(x) {
    var y = 100;
    return function innerFunc() {
      console.info(x + y);
    }
  }
  outerFunc(10)(); //110

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
HTML 自动伸缩的表格Table js实现
Apr 01 Javascript
JavaScript原型继承之基础机制分析
Aug 26 Javascript
JavaScript中判断对象类型的几种方法总结
Nov 11 Javascript
JavaScript中的分号插入机制详细介绍
Feb 11 Javascript
深入理解JavaScript中的对象复制(Object Clone)
May 18 Javascript
浅析如何利用angular结合translate为项目实现国际化
Dec 08 Javascript
vue中接口域名配置为全局变量的实现方法
Sep 20 Javascript
用WebStorm进行Angularjs 2开发(环境篇:Windows 10,Angular-cli方式)
Dec 05 Javascript
实用Javascript调试技巧分享(小结)
Jun 18 Javascript
ElementUI多个子组件表单的校验管理实现
Nov 07 Javascript
详解Nuxt.js 实战集锦
Nov 19 Javascript
vue 解决setTimeOut和setInterval函数无效报错的问题
Jul 30 Javascript
jQuery时间轴插件使用详解
Jul 16 #Javascript
jQuery实现定时读取分析xml文件的方法
Jul 16 #Javascript
Javascript函数的参数
Jul 16 #Javascript
Javascript简单改变表单元素背景的方法
Jul 15 #Javascript
JavaScript基于ajax编辑信息用法实例
Jul 15 #Javascript
JavaScript实现对下拉列表值进行排序的方法
Jul 15 #Javascript
jQuery简单实现验证邮箱格式
Jul 15 #Javascript
You might like
使用PHP socke 向指定页面提交数据
2008/07/23 PHP
基于MySQL体系结构的分析
2013/05/02 PHP
PHP中开启gzip压缩的2种方法
2015/01/31 PHP
Laravel中扩展Memcached缓存驱动实现使用阿里云OCS缓存
2015/02/10 PHP
php封装db类连接sqlite3数据库的方法实例
2017/12/19 PHP
让你的PHP,APACHE,NGINX支持大文件上传
2021/03/09 PHP
js输出列表实现代码
2010/09/12 Javascript
js读写cookie实现一个底部广告浮层效果的两种方法
2013/12/29 Javascript
jQuery中innerWidth()方法用法实例
2015/01/19 Javascript
jquery滚动到顶部底部代码
2015/04/20 Javascript
Vue-路由导航菜单栏的高亮设置方法
2018/03/17 Javascript
vue-video-player 通过自定义按钮组件实现全屏切换效果【推荐】
2018/08/29 Javascript
详解vue为什么要求组件模板只能有一个根元素
2019/07/22 Javascript
JavaScript键盘事件响应顺序详解
2019/09/30 Javascript
解决$store.getters调用不执行的问题
2019/11/08 Javascript
mpvue网易云短信接口实现小程序短信登录的示例代码
2020/04/03 Javascript
JS代码简洁方式之函数方法详解
2020/07/28 Javascript
js实现简易拖拽的示例
2020/10/26 Javascript
[01:12:44]VG vs Mineski Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
Python 字典(Dictionary)操作详解
2014/03/11 Python
Python实现的几个常用排序算法实例
2014/06/16 Python
Django发送html邮件的方法
2015/05/26 Python
Python 错误和异常代码详解
2018/01/29 Python
在Python文件中指定Python解释器的方法
2019/02/18 Python
基于python的socket实现单机五子棋到双人对战
2020/03/24 Python
基于Django框架的权限组件rbac实例讲解
2019/08/31 Python
基于OpenCV的网络实时视频流传输的实现
2020/11/15 Python
基于IE10/HTML5 开发
2013/04/22 HTML / CSS
Anya Hindmarch官网:奢侈设计师手袋及配饰
2018/11/15 全球购物
进修护士自我鉴定
2013/10/14 职场文书
妇产科护士自我鉴定
2013/10/15 职场文书
优秀共产党员先进事迹
2014/01/27 职场文书
总经理岗位职责范本
2014/02/02 职场文书
新春文艺演出主持词
2014/03/27 职场文书
售后客服工作职责
2014/06/16 职场文书
《窃读记》教学反思
2016/02/18 职场文书