区别JavaScript函数声明与变量声明

 更新时间:2018年09月12日 16:05:16   投稿:laozhang  
这篇文章给大家分享了关于JavaScript中函数声明与变量声明之间的区别以及相关知识点,有兴趣的朋友参考下。

今天,又由一到题目引发了一场我跟JS基础的较量:首先是

var getName = function(){alert(1)};
function getName(){alert(2)};
getName();// 1

or

function getName(){alert(2)};
var getName = function(){alert(1)};
 
getName();// 1

为什么我调换声明顺序,结果还是输出以 var 形式声明的函数的值?

有人回答我说 "啊,变量提升呀...",我最开始的理解,就算变量提升,第一种情况提升之后,应该是这样啊:

var getName;
getName = function(){alert(1)};
function getName(){alert(2)};

最后应该输出 2 才对啊(很理直气壮)。

殊不知不只有var声明才会提前,以function fn(){}这种形式声明的函数,会被提升到作用域的最最顶部,然后再是变量的提升。
具体请看下面例子:

fn();//Uncaught TypeError: fn is not a function
var fn = function(){console.log(1)};

but

fn();//2
var fn = function(){console.log(1)};
function fn(){console.log(2)}

足以说明函数提升的更凶一些。

相关文章

  • js贪吃蛇网页版游戏特效代码分享(挑战十关)

    js贪吃蛇网页版游戏特效代码分享(挑战十关)

    这篇文章主要为大家详细介绍了js贪吃蛇网页版游戏特效,游戏总共有十关,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2015-08-08
  • JavaScript语句可以不以;结尾的烦恼

    JavaScript语句可以不以;结尾的烦恼

    JavaScript语句可以不以;结尾的烦恼...
    2007-03-03
  • JavaScript数据结构之栈实例用法

    JavaScript数据结构之栈实例用法

    在本篇文章里小编给大家分享了关于JavaScript数据结构之栈实例用法内容,有兴趣的朋友们学习下。
    2019-01-01
  • JavaScript实现判断图片是否加载完成的3种方法整理

    JavaScript实现判断图片是否加载完成的3种方法整理

    这篇文章主要介绍了JavaScript实现判断图片是否加载完成的3种方法整理,本文讲解了onload方法、javascipt原生方法、jquery方法三种方法,需要的朋友可以参考下
    2015-03-03
  • 浅谈js键盘事件全面控制

    浅谈js键盘事件全面控制

    下面小编就为大家带来一篇浅谈js键盘事件全面控制。小编觉得挺不错的,在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-12-12
  • JavaScript面试出现频繁的一些易错点整理

    JavaScript面试出现频繁的一些易错点整理

    通过几个常见面试开始,讨论针对一个题目的分析思路,就有了下面这篇文章,本文主要给大家整理总结介绍了关于JavaScript面试中会频繁出现的一些易错点,对大家具有一定的参考学习价值,需要的朋友们下面随着小编来一起看看吧。
    2018-03-03
  • 详解JavaScript如何实现一个简易的Promise对象

    详解JavaScript如何实现一个简易的Promise对象

    Promise对象的作用将异步操作以同步操作的流程表达出来,避免层层嵌套的回调函数,而且Promise提供了统一的接口,使得控制异步操作更加容易。本文介绍了如何实现一个简单的Promise对象,需要的可以参考一下
    2022-11-11
  • js编写简单的计时器功能

    js编写简单的计时器功能

    这篇文章主要为大家详细介绍了js编写简单的计时器功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • js调出上下文菜单的实例

    js调出上下文菜单的实例

    这篇文章主要介绍了js调出上下文菜单的实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2015-12-12
  • mapboxgl实现带箭头轨迹线的代码

    mapboxgl实现带箭头轨迹线的代码

    这篇文章主要介绍了mapboxgl实现带箭头轨迹线的代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-01-01

最新评论