详细分析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 相关文章推荐
关于锚点跳转及jQuery下相关操作与插件
Oct 01 Javascript
js获取input长度并根据页面宽度设置其大小及居中对齐
Aug 22 Javascript
javascript使用avalon绑定实现checkbox全选
May 06 Javascript
Bootstrap3 图片(响应式图片&图片形状)
Jan 04 Javascript
JavaScript中利用for循环遍历数组
Jan 15 Javascript
详解从Node.js的child_process模块来学习父子进程之间的通信
Mar 27 Javascript
js实现按座位号抽奖
Apr 05 Javascript
Ionic3实现图片瀑布流布局
Aug 09 Javascript
详解 vue.js用法和特性
Oct 15 Javascript
JavaScript笛卡尔积超简单实现算法示例
Jul 30 Javascript
jQuery pjax 应用简单示例
Sep 20 jQuery
vue动态子组件的两种实现方式
Sep 01 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可逆加密/解密函数分享
2012/09/25 PHP
php setcookie(name, value, expires, path, domain, secure) 参数详解
2013/06/28 PHP
CI框架学习笔记(二) -入口文件index.php
2014/10/27 PHP
PHP向socket服务器收发数据的方法
2015/01/24 PHP
php实现约瑟夫问题的方法小结
2015/03/23 PHP
PHP文件操作之获取目录下文件与计算相对路径的方法
2016/01/08 PHP
PHP中一个有趣的preg_replace函数详解
2018/08/15 PHP
一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
2009/05/21 Javascript
javascript定义函数的方法
2010/12/06 Javascript
jQuery判断密码强度实现思路及代码
2013/04/24 Javascript
jQuery ReferenceError: $ is not defined 错误的处理办法
2013/05/10 Javascript
Javascript基础知识(一)核心基础语法与事件模型
2014/09/29 Javascript
用原生JS获取CLASS对象(很简单实用)
2014/10/15 Javascript
基于jQuery实现Ajax验证用户名是否存在实例
2016/03/30 Javascript
深入浅析JSON.parse()、JSON.stringify()和eval()的作用详解
2016/04/03 Javascript
js仿腾讯QQ的web登陆界面
2016/08/19 Javascript
jQuery实现的多张图无缝滚动效果【测试可用】
2016/09/12 Javascript
Angularjs中的验证input输入框只能输入数字和小数点的写法(推荐)
2017/08/16 Javascript
elemetUi 组件--el-upload实现上传Excel文件的实例
2017/10/27 Javascript
JS计算距当前时间的时间差实例
2017/12/29 Javascript
JavaScript封装的常用工具类库bee.js用法详解【经典类库】
2018/09/03 Javascript
微信小程序组件传值图示过程详解
2019/07/31 Javascript
nuxt 实现在其它js文件中使用store的方式
2020/11/05 Javascript
[01:32]DOTA2次级联赛——首支职业女子战队选拔赛全记录
2014/10/23 DOTA
[01:10:03]OG vs EG 2018国际邀请赛淘汰赛BO3 第三场 8.23
2018/08/24 DOTA
使用Python标准库中的wave模块绘制乐谱的简单教程
2015/03/30 Python
解析Python中的生成器及其与迭代器的差异
2016/06/20 Python
Django objects.all()、objects.get()与objects.filter()之间的区别介绍
2017/06/12 Python
TensorFlow在MAC环境下的安装及环境搭建
2017/11/14 Python
tensorflow 用矩阵运算替换for循环 用tf.tile而不写for的方法
2018/07/27 Python
python实现顺序表的简单代码
2018/09/28 Python
css3实现的下拉菜单效果示例
2014/01/22 HTML / CSS
Burt’s Bees英国官网:世界领先的天然个人护理品牌
2020/08/17 全球购物
Shell脚本如何向终端输出信息
2014/04/25 面试题
2015年招生工作总结
2015/05/04 职场文书
出纳试用期工作总结2015
2015/05/28 职场文书