Variable hoisting Function hoisting

Variable hoisting

Another unusual thing about variables in JavaScript is that you can refer to a variable declared later, without getting an exception. This concept is known as hoisting; variables in JavaScript are in a sense "hoisted" or lifted to the top of the function or statement. However, variables that are hoisted will return a value of undefined. So even if you declare and initialize after you use or refer to this variable, it will still return undefined.

/**
 * Example 1
 */
console.log(x === undefined); // true
var x = 3;

/**
 * Example 2
 */
// will return a value of undefined
var myvar = "my value";

(function() {
  console.log(myvar); // undefined
  var myvar = "local value";
})();

The above examples will be interpreted the same as:

/**
 * Example 1
 */
var x;
console.log(x === undefined); // true
x = 3;

/**
 * Example 2
 */
var myvar = "my value";

(function() {
  var myvar;
  console.log(myvar); // undefined
  myvar = "local value";
})();

Because of hoisting, all var statements in a function should be placed as near to the top of the function as possible. This best practice increases the clarity of the code.

In ECMAScript 2015, let (const) will not hoist the variable to the top of the block. However, referencing the variable in the block before the variable declaration results in a ReferenceError. The variable is in a "temporal dead zone" from the start of the block until the declaration is processed.

console.log(x); // ReferenceError
let x = 3;

Function hoisting

For functions, only function declaration gets hoisted to the top and not the function expression.

/* Function declaration */

foo(); // "bar"

function foo() {
  console.log("bar");
}

/* Function expression */

baz(); // TypeError: baz is not a function

var baz = function() {
  console.log("bar2");
};
时间: 2024-10-22 06:53:47

Variable hoisting Function hoisting的相关文章

详解Javascript Function陷阱

Javascript Function无处不在,而且功能强大!通过Javascript函数可以让JS具有面向对象的一些特征,实现封装.继承等,也可以让代码得到复用.但事物都有两面性,Javascript函数有的时候也比较“任性”,你如果不了解它的“性情”,它很可能给你制造出一些意想不到的麻烦(bugs)出来. Javascript Function有两种类型: 1)函数声明(Function Declaration); // 函数声明 function funDeclaration(type){

c 可变参数(variable argument)的原理及使用

本文主要介绍可变参数的函数使用,然后分析它的原理,程序员自己如何对它们实现和封装,最后是可能会出现的问题和避免措施. VA函数(variable argument function),参数个数可变函数,又称可变参数函数.C/C++编程中,系统提供给编程人员的va函数很少.*printf()/*scanf()系列函数,用于输入输出时格式化字符串:exec*()系列函数,用于在程序中执行外部文件(main(int argc,char*argv[]算不算呢,与其说main()也是一个可变参数函数,倒不

JavaScript基础函数体中的唯一var模式(002)

全局变量是不好的.所以在声名变量的时候,应该采用函数体中的唯一var模式(Single var Pattern).这个模式有不少好处: 提供了一个唯一的地方来查看函数体中声名的变量 在使用一个变量之前总是先声名,这样未初始化的变量都会被赋值为undefine. 让你记得要声名变量.:-) 代码更简洁(因为把多个var变成了一个) 说来也简单,这个模式就是在函数体的最初,用一个var声名所有本地变量(local variable). function func() { var a = 1, b =

JAVASCRIPT的一些知识点梳理

春节闲点,可以安心的梳理一下以前不是很清楚的东东.. 看的是以下几个URL: http://web.jobbole.com/82520/ http://blog.csdn.net/luoweifu/article/details/41466537 http://javascriptissexy.com/understand-javascript-closures-with-ease/ http://javascriptissexy.com/javascript-variable-scope-an

Top 10 JavaScript traps for a C# developer

Top 10 JavaScript traps for a C# developer 27 May 2014   | .NET · Code · Javascript Tags: .net · C# · javascript If you are an experienced C# developer, coming into JavaScript world for application development, you will end up making few common mista

你胸大你先说:变量提升

场景引入:一个屋子里,不管进门的顺序如何,如果有胸大腰细的妹子,总是有最先说话的权利. 场景类比:一段代码内,不管声明的顺序如何,显式声明的变量和函数,总是会被提到最前解析. 这次要介绍的同样是js世界很奇怪的现象:变量提升.定义如下: Hoisting is JavaScript's default behavior of moving declarations to the top. 提升是js的默认行为,它把声明(变量或函数)移动到(当前作用域的)最顶 一般计算机语言,有“先声明再使用”的

js中的var

vars变量预解析 JavaScript中,你可以在函数的任何位置声明多个var语句,并且它们就好像是在函数顶部声明一样发挥作用,这种行为称为 hoisting(悬置/置顶解析/预解析).当你使用了一个变量,然后不久在函数中又重新声明的话,就可能产生逻辑错误.对于JavaScript,只要你的变量是在同一个作用域中(同一函数),它都被当做是声明的,即使是它在var声明前使用的时候.看下面这个例子: 1 // 反例 2 myname = "global"; // 全局变量 3 funct

【转】JavaScript 风格指南/编码规范(Airbnb公司版)

原文转自:http://blog.jobbole.com/79484/ Airbnb 是一家位于美国旧金山的公司,本文是其内部的 JavaScript 风格指南/编码规范,在 Github 上有 11,000+ Star,2100+ fork,前端开发者可参考. 基本类型:当你访问基本类型时,你是直接对它的值进行操作. string number boolean null undefined 1 2 3 4 5 6 var foo = 1, bar = foo; bar = 9; console

一份来自于全球的前端面试题清单,看看老外喜欢考哪些题(部分有答案)

方括号中的蓝色标题是题目的出处,有些题目在原址内包含答案.搜集的大部分外国前端面试题没有做翻译,单词并不难,大家应该看得懂.题目旁边的方括号内, 简单记录了与此题相关的知识点.总共大概一千多道,包含国内的题目,如有错误,欢迎指正.有些原链可能已无法打开,有些可能需要代理才能查看. 一.HTML [HTML related interview questions] 1.What is doctype? Why do u need it? 2.What is the use of data-* at