萌新的前端自学之旅第一步 js变量提升
程序员文章站
2024-03-23 23:16:10
...
emmm希望有人看吧,希望有大佬指点一下前端学习路线!希望不要有大佬说我
练习1:
console.log(a);
var a = 12;
function fn() {
console.log(a);
var a = 13;
}
fn();
console.log(a);
// 1. 变量提升 var function
// var a; fn();
// 2. 从上往下执行
// 第一个打印undefined; a = 12; 执行function
// 形参赋值,变量提升 var a(私有) 所以第二个打印为underfined;
// 3. 第三个打印为12
练习2:
var foo = 1;
function bar() {
if (!foo){
var foo = 10;
}
console.log(foo);
}
bar();
// 1. 变量提升 var function
// var foo; bar();
// 2. 从上往下执行
// foo = 1; 执行function
// 形参赋值,变量提升 var foo(私有) 此时foo为undefined(布尔值为false) !foo 即为true
// 注: ! 布尔取反(进入if判断 function中局部变量foo值为10).
// 3. 打印为10
练习3:
var n = 0;
function a() {
var n = 10;
function b() {
n++;
console.log(n);
}
b();
return b;
}
var c = a();
c();
console.log(n);
// 1. 变量提升 var function
// var n; a(); var c;
// 2. 从上往下执行
// 执行function a()
// 形参赋值,变量提升 var n(私有) b();
// 从上往下执行 私有n = 10; n(私有)(因为没有var 所以去上级找)++;
// 执行b n(私有) = 11; 第一次打印值为11 a(函数值为它的返回值)的值为b();
// 3. c = b(); 调用c n++ 并打印 a = 12;
// 3. 最后打印全局 n = 0 ;
练习4:
var a = 10,b = 11, c = 12;
function test(a) {
a = 1;
var b = 2;
c = 3;
}
test(10);
console.log(a);
console.log(b);
console.log(c);
// 1. 变量提升 var function
// var a; var b; var c; test(a);
// 2. 从上往下执行
// 全局 a = 12; 全局 b = 11; 全局 c = 12; 执行function
// 形参赋值,变量提升 形参 a = 10; var b;
// 形参 a = 1 私有 b = 2; 全局 c = 3;
// 3. 打印a为全局a为10; 打印b为全局b为11; 打印c为全局c为3
练习5:
if (!("a" in window)){
var a = 1;
}
console.log(a);
// 1. 变量提升 var function
// var a (其实同时多了一个window.a)
// 2. 从上往下执行
// window.a in window 为 true ! 取反后为 false 无法进入if判断
// a = undefined
// 3. 打印 a = undefined;
练习6:
var a = 4;
function b(x,y,a) {
console.log(a);
arguments[2] = 10;
console.log(a);
}
a = b(1,2,3);
console.log(a);
// arguments 和形参之间的映射(建立在函数执行后形参赋值的一瞬间,后面添加的都不会建立映射)是以arguments的索引为基础完成的,索引对不上赋值为undefined
// 1. 变量提升 var function
// var a; b();
// 2. 从上往下执行
// a = 4; 执行function
// 形参赋值,变量提升 形参x = 1 y = 2 a = 3
// 打印传入形参a的值为 3; 私有a = 10; 打印a = 10;
// 3. 打印全局a a 为函数b返回的结果 因为b没有return 所以a为undefined
练习7:
var a = 9;
function fn() {
a = 0;
return function (b) {
return b + a++;
}
}
var f = fn();
console.log(f(5));
console.log(fn()(5)); //先执行fn()(会把已经变成1的全局变量a重新赋值为0) 再执行返回值
console.log(f(5));
console.log(a);
// 1. 变量提升 var function
// var a; fn() var f;
// 2. 从上往下执行
// 全局a = 9; 执行function
// 形参赋值,变量提升
// 全局a = 0; fn()值为 function (b){}; 不可销毁 因为内容被外部一直占用
// 执行function(b){}
// function(b)为 b+a++(++会在当前执行后执行,全局a++);
// 全局f = fn()
// 3. 打印第一个值为 5; 打印第二个值为 5; 打印第三个值为 6; 打印a为2;
上一篇: 菜鸟的第一步
下一篇: do while与while的区别
推荐阅读