详细分析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 相关文章推荐
javascript实现unicode和字符的互相转换
Jul 18 Javascript
通过jQuery源码学习javascript(三)
Dec 27 Javascript
JS简单的轮播的图片滚动实例
Jun 17 Javascript
js页面跳转的问题(跳转到父页面、最外层页面、本页面)
Aug 14 Javascript
javascript实现网页背景烟花效果的方法
Aug 06 Javascript
总结在前端排序中遇到的问题
Jul 19 Javascript
浅析location.href跨窗口调用函数
Nov 22 Javascript
分享Bootstrap简单表格、表单、登录页面
Aug 04 Javascript
浅谈vue中.vue文件解析流程
Apr 24 Javascript
iview的table组件自带的过滤器实现
Jul 12 Javascript
微信小程序实现手势滑动卡片效果
Aug 26 Javascript
JS实现横向轮播图(中级版)
Jan 18 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之变量、常量学习笔记
2008/03/27 PHP
PHP在网页中动态生成PDF文件详细教程
2014/07/05 PHP
thinkPHP实现瀑布流的方法
2014/11/29 PHP
PHP实现二叉树的深度优先与广度优先遍历方法
2015/09/28 PHP
PHP实现清除wordpress里恶意代码
2015/10/21 PHP
PHP调用微博接口实现微博登录的方法示例
2018/09/22 PHP
jMessageBox 基于jQuery的窗口插件
2009/12/09 Javascript
基于jquery的checkbox下拉框插件代码
2010/06/25 Javascript
浅析document.ready和window.onload的区别讲解
2013/12/18 Javascript
jquery mobile的触控点击事件会多次触发问题的解决方法
2014/05/08 Javascript
使用JavaScript和C#中获得referer
2014/11/14 Javascript
多个jQuery版本共存的处理方案
2015/03/17 Javascript
javascript中caller和callee详解
2015/08/10 Javascript
浏览器环境下JavaScript脚本加载与执行探析之defer与async特性
2016/01/14 Javascript
原生JS和jQuery操作DOM对比总结
2017/01/19 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
validationEngine 表单验证插件使用实例代码
2017/06/15 Javascript
用vue快速开发app的脚手架工具
2018/06/11 Javascript
在vue项目中,将juery设置为全局变量的方法
2018/09/25 Javascript
express 项目分层实践详解
2018/12/10 Javascript
Node.js+ELK日志规范的实现
2019/05/23 Javascript
vue的路由映射问题及解决方案
2019/10/14 Javascript
使用Python编写基于DHT协议的BT资源爬虫
2016/03/19 Python
Python判断某个用户对某个文件的权限
2016/10/13 Python
Python可变参数用法实例分析
2017/04/02 Python
Python动态赋值的陷阱知识点总结
2019/03/17 Python
django中forms组件的使用与注意
2019/07/08 Python
python3.7 的新特性详解
2019/07/25 Python
python模拟实现斗地主发牌
2020/01/07 Python
突袭HTML5之Javascript API扩展5—其他扩展(应用缓存/服务端消息/桌面通知)
2013/01/31 HTML / CSS
美国购物网站:Clickhere2shop
2021/01/28 全球购物
美国购买韩国护肤和美容产品网站:Althea Korea
2020/11/16 全球购物
商场开业庆典策划方案
2014/06/02 职场文书
服务行业口号
2014/06/11 职场文书
教师教育教学随笔
2015/08/15 职场文书
基于JavaScript实现年月日三级联动
2021/06/22 Javascript