`

Javascript中两种方式定义函数的区别

阅读更多
相信两种方式大家都用过,但未必所有人都知道其 区别,内部原理。

Js代码
// 方式1
function func1(x,y){
	// your code
}	
// 方式2
var func2 = function(x,y){
	// your code
} 

方式1 是典型的函数声明(Function declarations)。
方式2 是函数表达式(Function expressions),将一个匿名函数赋值给一个变量。或者说方式2中创建了一个具有形参为x,y的匿名函数,然后把该匿名函数赋值给变量func2。


其主要区别在于:
1, 函数声明需显示的指定函数名,这里是func1;函数表达式则使用匿名函数
2, 方式1在代码执行之前(解释期)被加载到作用域中,方式2则需在代码执行时(运行期)加载


一个简单示例就明白了它们在使用上的区别
Js代码

alert(func1); // --> func1源码
alert(func2); // --> undefined
// 方式1
function func1(x,y){
	// your code
}	
// 方式2
var func2 = function(x,y){
	// your code
} 

可以看到,第一次弹出的是func1的源码,第二次却是undefined。即采用方式1(函数声明)定义函数,可以在该函数代码之上使用它,采用方式2(函数表达式)定义函数则不能在其定义前使用,只能在其定义后使用。


其内部涉及到 执行上下文(Execution context)及 激活对象(Activation object)。想更深了解的请阅读EcmaScript 5文档。


最近发现越来越多的人喜欢使用方式2定义函数,尤其在嵌套函数中。如单纯的定义一个函数个人还是习惯方式1。
分享到:
评论

相关推荐

    【JavaScript源代码】JavaScript中箭头函数与普通函数的区别详解.docx

    JavaScript中箭头函数...箭头函数有两种格式,一种只包含一个表达式,连{ ... }和return都省略掉了。还有一种可以包含多条语句,这时候就不能省略{ ... }和return。 箭头函数是匿名函数,不能作为构造函数,不能使用n

    JavaScript中的函数的两种定义方式和函数变量赋值

    主要介绍了JavaScript中的函数的两种定义方式和函数变量赋值,需要的朋友可以参考下

    浅析javascript中函数声明和函数表达式的区别

    javascript中声明函数的方法有两种:函数声明式和函数表达式. 区别如下: 1).以函数声明的方法定义的函数,函数名是必须的,而函数...下面分别用两种方法定义函数: 代码如下:  //函数声明式  function greeting(){  

    javascript 用函数语句和表达式定义函数的区别详解

    通常我们会看到以下两种定义函数的方式: 代码如下:// 函数语句function fn(str){ console.log(str);}; // 表达式定义var fnx=function(str){ console.log(str+ ‘ from fnx’);};以前都是凭借自己手指的感觉...

    javascript函数的解释

    68.JS中分为两种窗体输出:模态和非模态.window.showModaldialog(),window.showModeless() 69.状态栏文字的设置:window.status='文字',默认的状态栏文字设置:window.defaultStatus = '文字.'; 70.添加到收藏夹:...

    javascript 两种声明函数的方式的分析

    JavaScript有两种声明函数的方式,一个是函数表达式定义函数,也就是我们说的匿名函数方式,一个是函数语句定义函数,下面看代码: /*方式一*/ var FUNCTION_NAME = function() { /* FUNCTION_BODY */}; /*方式二*/...

    浅谈javascript 函数表达式和函数声明的区别

    javascript中声明函数的方法有两种:函数声明式和函数表达式. 区别如下: 1).以函数声明的方法定义的函数,函数名是必须的,而函数表达式...下面分别用两种方法定义函数: //函数声明式 function greeting(){ console.l

    Javascript中实现trim()函数的两种方法

    在JavaScript中我们需要用到trim的地方很多,但是JavaScript又没有独立的trim函数或者方法可以使用,所以我们需要自己写个trim函数来实现我们的目的。 方案一: 以原型方式调用,即obj.trim()形式,此方式简单且使用...

    JavaScript中立即执行函数实例详解

    ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因...

    【JavaScript源代码】配置vue全局方法的两种方式实例.docx

    配置vue全局方法的两种方式实例  目录 1,前言 2,第一种方式 3,第二种方式 总结 1,前言  2,第一种方式  3,第二种方式  总结 1,前言  在Vue项目开发中,肯定会有这样一个场景:在不同的组件页面用到...

    JavaScript中函数声明与函数表达式的区别详解

    在ECMAScript中,有两个最常用的创建函数对象的方法,即使用函数表达式或者使用函数声明。对此,ECMAScript规范明确了一点,即是,即函数声明 必须始终带有一个标识符(Identifier),也就是我们所说的函数名,而...

    JavaScript匿名函数用法分析

    但是两种方式定义函数,效果是不同的 t1是函数声明,‘词法分析’时,AO.t1 = function(){},————-在‘词法分析’阶段就发挥作用 t2是赋值操作,‘运行’时,AO.t2 = function(){},值是右边的表达式返回的结果,...

    javascript高级编程之函数表达式 递归和闭包函数

    定义函数表达式有两种方式:函数声明和函数表达式. 函数声明如下: function functionName(arg0,arg1,arg2){ //函数体 } 首先是function关键字,然后是函数的名字. FF,Safrai,Chrome和Opera都给函数定义了一个非标准...

    老生常谈JavaScript 函数表达式

    JavaScript中创建函数主要有两种方法:函数声明和函数表达式。这两种方式都有不同的适用场景。这篇笔记主要关注的是函数表达式的几大特点以及它的使用场景,下面一一描述。 主要特点 •可选的函数名称 函数名称是...

    javascript 函数声明与函数表达式的区别介绍

    // 2 [removed] 把这段代码扔到IE 6 里面和chorme里面是完全不同的两种效果。 这里输出2 是在ie6里面的效果,如果在chorme会出现g没有定义。 这也算是JScript的bug吧。 在这里很明显,这里的只是定义了g的函数...

    深入理解javascript中的立即执行函数(function(){…})()

    ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因...

    基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解

    首先来分析构造函数和原型链两种实现继承方式的缺陷: 构造函数(对象冒充)的主要问题是必须使用构造函数方式,且无法继承通过原型定义的方法,这不是最好的选择。不过如果使用原型链,就无法使用带参数的构造函数...

    谈谈JavaScript中的函数

    JS中函数定义,有如下两种形式: 方式1 function f1(){} //函数声明,f1为函数名,可以将其理解为变量f1指向一个函数 function f2(){return 100;}//函数允许有返回值 function f3(a,b){}//函数中可以定义多个参数,...

    JavaScript函数表达式详解及实例

     定义函数的方式有两种:一种是函数声明,另一种就是函数表达式;  1.1 函数声明 function functionName(arg){ //函数体 }  关于函数声明,它有一个重要特征就是函数声明提升,意思就是在执行代码之前会先读取...

Global site tag (gtag.js) - Google Analytics