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

使用javascript多年，写过无数函数，今天却才真正弄明白两种函数定义的区别，真是悲剧，写下这个随笔， 以时刻提醒自己要打好基础 ， 一大把年纪了， 不能继续懵懵懂懂了。

通常我们会看到以下两种定义函数的方式：


代码如下:

// 函数语句
function fn(str)
{
  console.log(str);
};

// 表达式定义
var fnx=function(str)
{
  console.log(str+ ' from fnx');
};

以前都是凭借自己手指的感觉随心所欲使用两者 -_- || ，今天看了js基础， 总算是解决了心中对他们的困惑：

两种方式都创建了新的函数对象， 但函数声明语句的函数名是一个变量名， 变量指向函数对象， 和通过var声明变量一样，函数定义语句中的函数被显示地提前到了脚本或函数的顶部， 因此它们在整个脚本和函数内都是可见的，但是使用var 表达式定义函数， 只有变量声明提前了，变量初始化代码仍然在原来的位置， 用函数语句创建的函数， 函数名称和函数体均被提前，所以我们可以在声明它之前就使用它。

代码例子如下:


代码如下:

console.log(typeof(fn)); // function
    fn('abc'); // abc

console.log(typeof(fnx)); // undefined

if(fnx)
        fnx('abc');  // will not execute
    else
        console.log('fnx is undefined'); // fnx is undefined

// 函数语句
    function fn(str)
    {
        console.log(str);
    };

// 表达式定义
    var fnx=function(str)
    {
        console.log(str+ ' from fnx');
    };

代码很简单， 希望和我之前一样没有弄明白两者区别的同学能有所收获 。

赞 (0)

相关推荐

  • javascript定义函数的方法

    JavaScript 使用关键字 function 定义函数. 函数可以通过声明定义,也可以是一个表达式. 函数声明 在之前的教程中,你已经了解了函数声明的语法 : function functionName(parameters) { 执行的代码 } 函数声明后不会立即执行,会在我们需要的时候调用到. 实例 function myFunction(a, b) { return a * b; } 函数表达式 JavaScript 函数可以通过一个表达式定义. 函数表达式可以存储在变量中: 实例

  • 比较常见的javascript中定义函数的区别

    比较常见的javascript中定义函数的区别主要通过以下三个方面给大家讲解,需要的朋友参考下吧 1:调用关键字function来构造 如: function distance(x1,x2,y1,y2) { var dx=x2-x1; var dy=y2-y1; return Math.sqrt(dx*dx+dy*dy); } 2:使用Function()构造函数 如: var f=new Function*"x","y","return x*y"

  • javascript十个最常用的自定义函数(中文版)

    (10)addEvent 网上最流行的版本是Scott Andrew的,据说javascript界曾举行一场比赛(此事件我们可以在Pro Javascript Techniques第100页看到)或浏览PPK的网站,征求添加事件与移除事件的函数,他就是其获奖者.下面就是他的实现: 复制代码 代码如下: function addEvent(elm, evType, fn, useCapture) { if (elm.addEventListener) { elm.addEventListener(

  • javascript 最常用的10个自定义函数[推荐]

    (10)addEvent 网上最流行的版本是Scott Andrew的,据说javascript界曾举行一场比赛(此事件我们可以在Pro Javascript Techniques第100页看到)或浏览PPK的网站,征求添加事件与移除事件的函数,他就是其获奖者.下面就是他的实现: 复制代码 代码如下: function addEvent(elm, evType, fn, useCapture) { if (elm.addEventListener) { elm.addEventListener(

  • javascript的trim,ltrim,rtrim自定义函数

    <script type="text/javascript"> function trim(str){ //删除左右两端的空格 return str.replace(/(^\s*)|(\s*$)/g, ""); } function ltrim(str){ //删除左边的空格 return str.replace(/(^\s*)/g,""); } function rtrim(str){ //删除右边的空格 return str.re

  • JavaScript保留两位小数的2个自定义函数

    对于一些小数点后有多位的浮点数,我们可能只需要保留2位,但js没有提供这样直接的函数,所以我们得自己写函数实现这个功能,代码如下: 复制代码 代码如下: function changeTwoDecimal(x) {    var f_x = parseFloat(x);    if (isNaN(f_x)) {        alert('function:changeTwoDecimal->parameter error');        return false;    }    var

  • javascript提取URL的搜索字符串中的参数(自定义函数实现)

    今天在犀牛书上发现了一个有用的函数 urlArgs(提取URL的搜索字符串中的参数).我们经常会看到有的页面链接地址后面会跟有参数,比如 http://www.xxx.com/?username=yyy&password=zzz 之类的,很多时候我们需要获得这些参数的值(yyy和zzz),那么就可以利用 urlArgs 函数,通过该函数的返回值(返回值是对象)的属性来获取. urlArgs 函数代码: 复制代码 代码如下: function urlArgs(){ var args = {}; v

  • Javascript自定义函数判断网站访问类型是PC还是移动终端

    由于很多移动终端不支持 Flash,因此 许多绚丽多彩的 Flash效果出不来.如果,能够判断出访问Web网页的类型(PC还是移动终端).就可以对症下药,找出解决的办法! 访问的类型为移动终端我们就用.gif代替Flash(.swf后缀)动画,PC端就不做改变.这样就比较完美了! 如下所示,函数 flashChecker() 就是用来检测访问的类型. 复制代码 代码如下: <script language="javascript" type="text/javascri

  • javascript自定义函数参数传递为字符串格式

    自定义函数参数传递为 字符串格式 ,传递方式 1:用this传递 2:引号缺省 3:转义字符(html中 " 代表"双引号,&apos;代表单引号,javascript中直接\" 和Java通用转义字符集) <html> <head> <script language="LiveScript"> function print(arg){ alert("你好!"+arg); } </scr

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

    使用javascript多年,写过无数函数,今天却才真正弄明白两种函数定义的区别,真是悲剧,写下这个随笔, 以时刻提醒自己要打好基础 , 一大把年纪了, 不能继续懵懵懂懂了. 通常我们会看到以下两种定义函数的方式: 复制代码 代码如下: // 函数语句function fn(str){  console.log(str);}; // 表达式定义var fnx=function(str){  console.log(str+ ' from fnx');}; 以前都是凭借自己手指的感觉随心所欲使用两

  • JavaScript数据结构之广义表的定义与表示方法详解

    JavaScript数据结构之广义表的定义与表示方法详解

    本文实例讲述了JavaScript数据结构之广义表的定义与表示方法.分享给大家供大家参考,具体如下: 广义表是线性表的推广,也有人称其为列表. 那么它和线性表有什么区别呢?线性表中每个成员只能是单个元素,而广义表中的成员可以是单个元素,也可以是广义表,分别称为广义表的原子和子表.下面举几个广义表的例子. A=(); B=(e); C=(a,(b,c,d)); D=((),(e),(a,(b,c,d))); E=(a,E); 由于广义表中的数据元素可以具有不同的结构(原子或列表),因此难以用顺序存

  • PHP中define() 与 const定义常量的区别详解

    本文实例讲述了PHP中define() 与 const定义常量的区别.分享给大家供大家参考,具体如下: 前言 今天在Stackoverflow又看到一个很有趣的文章,所以翻译过后摘了过来.文章是由PHP开发成员之一的NikiC写的,权威性自然毋庸置疑 正文 在PHP5.3中,有两种方法可以定义常量: 使用const关键字 使用define()方法 const FOO = 'BAR'; define('FOO','BAR'); 这两种方式的根本区别在于const会在代码编译时定义一个常量,而def

  • JavaScript中style.left与offsetLeft的使用及区别详解

    如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值, 这同offsetLeft是相同的,区别在于: 1. style.left 返回的是字符串,如28px,offsetLeft返回的是数值28,如果需要对取得的值进行计算,还用offsetLeft比较方便. 2. style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left. 3. s

  • 浅谈javascript:两种注释,声明变量,定义函数

    浅谈javascript:两种注释,声明变量,定义函数

    JavaScript:单行注释用//呵呵呵呵:多行注释用/*hdhdhdh*/ javascript中区别大小写,定义变量使用关键字var,语法如下:var 变量名,其中变量从编程角度讲,变量是用于存储某种/某些数值的存储器. javascript函数调用: 以上就是小编为大家带来的浅谈javascript:两种注释,声明变量,定义函数全部内容了,希望大家多多支持我们~

  • python函数定义和调用过程详解

    这篇文章主要介绍了python函数定义和调用过程详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 我们可以创建一个函数来列出费氏数列 >>> def fib(n): # write Fibonacci series up to n ... """Print a Fibonacci series up to n.""" ... a, b = 0, 1 ... while a &

  • javascript如何使用函数random来实现课堂随机点名方法详解

    如何使用函数random来实现课堂随机点名 1.最初的样子如下 2.点击开始点名,上面一行的文字变成名字,名字在不停的变化,开始点名变成停止点名,如下 3.点击停止点名,上面名字不动,停止点名变成开始点名,如下:李四同学回答老师问题 代码如下 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> #d2{

  • C语言字符串函数操作（strlen,strcpy,strcat,strcmp）详解

    C语言字符串函数操作（strlen,strcpy,strcat,strcmp）详解

    目录 一.strlen函数模拟 二. strcpy函数模拟  三.strcat函数模拟 四.strcmp函数模拟 总结 一.strlen函数模拟 字符串以'\0'作为结束标志,strlen函数返回的是在字符串中'\0'前面出现的字符个数(不包括'\0'); 有三种方法可以实现该操作: ①计数器方式 ②不能创建临时变量计数器 ③指针-指针  方法一:计数器方式 int my_strlen(const char* str) { int count = 0;//定义count用来记录字符串数组中字符数

  • C++中成员函数和友元函数的使用及区别详解

    为什么使用成员函数和友元函数 这个问题至关重要,直接影响着后面的理解: 程序数据: 数据是程序的信息,会受到程序函数的影响.封装是面向对象编程中的把数据和操作数据的函数绑定在一起的一个概念,这样能避免受到外界的干扰和误用,从而确保了安全. 数据封装引申出了另一个重要的 OOP 概念,即 数据隐藏 .数据封装 是一种把数据和操作数据的函数捆绑在一起的机制, 数据抽象 是一种仅向用户暴露接口而把具体的实现细节隐藏起来的机制.C++ 通过创建类来支持封装和数据隐藏(public.protected.p

  • Python函数进阶之迭代器的原理与使用详解

    目录 什么是迭代器 概念 特征 惰性序列 检查可迭代对象 定义迭代器 使用iter函数 使用__iter__方法 判断迭代器 检查内置方法 使用collections模块 调用迭代器 使用next方法和函数 什么是迭代器 能被 next 指针调用,并不断返回下一个值的对象,叫做迭代器.表示为Iterator,迭代器是一个对象类型数据. 概念 迭代器指的是迭代取值的工具,迭代是一个重复的过程,每次重复都是基于上一次的结果而继续的,单纯的重复并不是迭代. 特征 迭代器并不依赖索引,而通过 next

随机推荐