详细分析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 28 Javascript
js jquery数组介绍
Jul 15 Javascript
javascript中的this详解
Dec 08 Javascript
WebGL利用FBO完成立方体贴图效果完整实例(附demo源码下载)
Jan 26 Javascript
jQuery Easyui实现左右布局
Jan 26 Javascript
Bootstrap popover用法详解
Dec 22 Javascript
angularjs的select使用及默认选中设置
Apr 08 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
Jun 17 Javascript
浅析Vue中拆分视图层代码的5点建议
Aug 15 Javascript
微信小程序实现二维码签到考勤系统
Jan 16 Javascript
微信小程序仿抖音视频之整屏上下切换功能的实现代码
May 24 Javascript
如何利用vue实现波谱拟合详解
Nov 05 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下常用正则表达式整理
2010/10/26 PHP
ThinkPHP CURD方法之page方法详解
2014/06/18 PHP
php实现xml转换数组的方法示例
2017/02/03 PHP
在laravel中实现将查询的对象转换为多维数组的函数
2019/10/21 PHP
json2.js的初步学习与了解
2011/10/06 Javascript
ie7+背景透明文字不透明超级简单的实现方法
2014/01/17 Javascript
from表单多个按钮提交用onclick跳转不同action
2014/04/24 Javascript
DOM 高级编程
2015/05/06 Javascript
深入浅出分析javaScript中this用法
2015/05/09 Javascript
jquery实现LED广告牌旋转系统图片切换效果代码分享
2015/08/26 Javascript
json实现添加、遍历与删除属性的方法
2016/06/17 Javascript
js实现动态创建的元素绑定事件
2016/07/19 Javascript
prototype与__proto__区别详细介绍
2017/01/09 Javascript
Node.js 中exports 和 module.exports 的区别
2017/03/14 Javascript
原生js封装自定义滚动条
2017/03/24 Javascript
JS简单实现滑动加载数据的方法示例
2017/10/18 Javascript
js限制input只能输入有效的数字(第一个不能是小数点)
2018/09/28 Javascript
javascript中一些奇葩的日期换算方法总结
2018/11/14 Javascript
jQuery实现的鼠标拖动画矩形框示例【可兼容IE8】
2019/05/17 jQuery
9个JavaScript日常开发小技巧
2020/10/06 Javascript
python使用百度翻译进行中翻英示例
2014/04/14 Python
浅谈Python2获取中文文件名的编码问题
2018/01/09 Python
Python如何使用Gitlab API实现批量的合并分支
2019/11/27 Python
python发qq消息轰炸虐狗好友思路详解(完整代码)
2020/02/15 Python
Django模板获取field的verbose_name实例
2020/05/19 Python
django为Form生成的label标签添加class方式
2020/05/20 Python
keras 两种训练模型方式详解fit和fit_generator(节省内存)
2020/07/03 Python
django序列化时使用外键的真实值操作
2020/07/15 Python
TCP/IP的分层模型
2013/10/27 面试题
四年级语文教学反思
2014/02/05 职场文书
司法局群众路线教育实践活动开展情况总结
2014/10/25 职场文书
单方离婚协议书范本2014
2014/10/28 职场文书
支教个人总结
2015/03/04 职场文书
2016年艾滋病宣传活动总结
2016/04/01 职场文书
OpenCV-Python实现轮廓的特征值
2021/06/09 Python
一篇带你入门Java垃圾回收器
2021/06/16 Java/Android