变量提升与函数提升

变量提升

var声明的变量会提升到函数或全局作用域顶部

简单例子

// 全局作用域变量提升例子console.log(b)  // undefinedvar b = 4// 提升之后是这样var b;console.log(b) // 所以 b 没有值b = 4

// 函数作用域中变量提升var b = 5function test() {    console.log(b)  // undefined    var b = 4}// 变量提升之后 var b = 5function test() {    var b    console.log(b)  // 所以这里变量b 没有赋值 undefined    b = 4}

函数提升

函数写法:函数表达式、函数声明、Function构造函数（这种不推荐）.其中函数表达式不会函数提升，函数声明会函数提升。

// 在这例子中 var b 声明的变量会提升,匿名函数不会.var b = function() {    //...}// 提升之后var b ;b = function(){}

我们都知道程序在执行时是从上往下执行的,而这里test()在定义之前就调用了为什么不报错?

// 在编译阶段所有的函数声明都会被提升到顶部.所以这里可以在定义之前使用函数test()function test() {    console.log('ss')}// 提升之后function test() {    console.log('ss')}test()

实例一

num 值为多少?

var foo = function(x, y) {	return x - y;};function foo(x, y) {	return x + y;}var num = foo(1, 2);  // -1

根据函数提升原理可得提升之后

// 函数提升之后代码function foo(x, y) {	return x + y;}var foo = function(x, y) {  // 在这里 foo 函数被重写了	return x - y;};var num = foo(1, 2);  // -1

实例二

y和z的最终结果为: ?

var m = 1,	j = (k = 0);function add(n) {	return (n = n + 1);}y = add(m);function add(n) {	return (n = n + 3);}z = add(m);

这例子也是一样的函数提升,只要把提升之后的代码贴出来就能知道结果了

// 函数提升之后 如下:function add(n) {	return (n = n + 1);}function add(n) { // js中没有函数重载,这只是覆盖了上面定义的add函数	return (n = n + 3); // 相加完之后赋值给n 然后返回n}var m = 1,	j = (k = 0);  // k 是一个非定义变量,在严格模式下是错误的.y = add(m);  // 4z = add(m);  // 4

实例三

控制台打印结果是什么?

var b = 5;(function test(b) {	console.log(b);    var b = 10;})(b);console.log(b);

这里涉及了变量提升和参数与函数内部变量重复声明2个知识点

// 变量提升之后var b = 5;(function test(b) {    var b; // 这里是无效的,参数名与内部变量声明重复的情况下,重复声明是无效的.	console.log(b); // 5    b = 10;})(b);   // 参数传递console.log(b); // 5

实例四

这题为实例三变种类型,主要考察引用类型

var b = {	x: 5};(function test(b) {	console.log(b.x); // 5    var b = { x: 10 };    console.log(b.x) // 10})(b);console.log(b.x);  // 5

引用类型传递的是指针,指针指向了变量存储地址.这例子里,2个b变量都指向了同一个地址,所以第一次输出5,然后下面修改了函数内部变量b的指向,它指向了一个新的存储地址,这里输出的是10.全局变量b的指向并没有变,所以这里输出的依然是5

个人博客地址 : https://www.zhuamimi.cn
文章地址 : https://www.zhuamimi.cn/archives/201