详细分析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 相关文章推荐
列表内容的选择
Jun 30 Javascript
javascript中创建对象的三种常用方法
Dec 30 Javascript
限制上传文件大小和格式的jQuery插件实例
Jan 24 Javascript
js实现跟随鼠标移动且带关闭功能的图片广告实例
Feb 26 Javascript
JavaScript实现向setTimeout执行代码传递参数的方法
Apr 16 Javascript
JavaScript reduce和reduceRight详解
Oct 24 Javascript
浅析Node.js:DNS模块的使用
Nov 23 Javascript
Bootstrap 模态框实例插件案例分析
Dec 28 Javascript
js使用generator函数同步执行ajax任务
Sep 05 Javascript
使用JavaScript实现一个小程序之99乘法表
Sep 21 Javascript
微信小程序仿RadioGroup改变样式的处理方案
Jul 13 Javascript
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
Aug 06 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入门学习知识点五 关于php数组的几个基本操作
2011/07/14 PHP
WordPress开发中自定义菜单的相关PHP函数使用简介
2016/01/05 PHP
利用laravel搭建一个迷你博客实战教程
2017/08/13 PHP
利用Ext Js生成动态树实例代码
2008/09/08 Javascript
跨浏览器开发经验总结(四) 怎么写入剪贴板
2010/05/13 Javascript
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
2011/04/27 Javascript
javascript event在FF和IE的兼容传参心得(绝对好用)
2014/07/10 Javascript
JS的location.href跳出框架打开新页面的方法
2014/09/04 Javascript
nodejs URL模块操作URL相关方法介绍
2015/03/03 NodeJs
jQuery插件ajaxfileupload.js实现上传文件
2020/10/23 Javascript
微信小程序 slider 详解及实例代码
2017/01/10 Javascript
详解Vue Elementui中的Tag与页面其它元素相互交互的两三事
2018/09/25 Javascript
vue-router两种模式区别及使用注意事项详解
2019/08/01 Javascript
WebPack工具运行原理及入门教程
2020/12/02 Javascript
《Python之禅》中对于Python编程过程中的一些建议
2015/04/03 Python
python打开url并按指定块读取网页内容的方法
2015/04/29 Python
在Django框架中运行Python应用全攻略
2015/07/17 Python
与Django结合利用模型对上传图片预测的实例详解
2019/08/07 Python
Python超越函数积分运算以及绘图实现代码
2019/11/20 Python
python 实现简单的FTP程序
2019/12/27 Python
Python代码需要缩进吗
2020/07/01 Python
详解python使用金山词霸的翻译功能(调试工具断点的使用)
2021/01/07 Python
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
Roxy俄罗斯官方网站:冲浪和滑雪板的一切
2020/06/20 全球购物
网络工程师面试(三木通信技术有限公司)
2013/06/05 面试题
应届行政管理专业个人自我评价
2013/12/28 职场文书
个人简历中的自我评价怎么写
2014/01/26 职场文书
会计员岗位职责
2014/03/15 职场文书
授权委托书样本
2014/04/03 职场文书
小学生操行评语大全
2014/04/22 职场文书
3分钟英语演讲稿
2014/04/29 职场文书
幼儿园中班区域活动总结
2014/07/09 职场文书
社区灵活就业证明
2014/11/03 职场文书
亲属关系公证书样本
2015/01/23 职场文书
小学运动会加油稿
2015/07/22 职场文书
MySQL七大JOIN的具体使用
2022/02/28 MySQL