海外域名提示风险网站吗,义乌网站建设软件开发,wordpress the_post分类id,成都网站建设推来客网站系统JavaScript中var#xff0c;let#xff0c;const 的区别 一、前言二、使用var声明变量1、var 声明的变量是函数作用域2、var声明的变量会有变量提升3、全局作用域中声明的变量会被挂载到全局对象的window中4、同一作用域下#xff0c;可以重复声明相同的变量名 三、使用let声… JavaScript中varletconst 的区别 一、前言二、使用var声明变量1、var 声明的变量是函数作用域2、var声明的变量会有变量提升3、全局作用域中声明的变量会被挂载到全局对象的window中4、同一作用域下可以重复声明相同的变量名 三、使用let声明变量1、使用let声明的变量具有块级作用域的特点2、let声明的变量有暂时性死区没有变量提升必须先声明再使用3、全局作用域中使用let声明的变量不会挂载到window对象中4、同一作用域下不能使用let重复声明相同的变量 四、使用const声明常量1、const声明常量必须赋初始值2、const声明的常量不能更改 五、声明变量的其他方式六、应用实例1、for循环中的let和var2、for循环结合定时器3、const的使用 七、推荐使用的声明方式1、不推荐使用var推荐使用let和const2、优先使用const,其次是let 八、总结 一、前言
自ES6ECMAScript2015出来后JavaScript中又多了两种声明变量的关键字let和const但是const声明的变量通常是常量因为一旦声明便不可改变。那么这三种方式使用哪一种比较好呢它们之间又有什么区别呢接下来说一下我的理解。
二、使用var声明变量 var是ECMAScript规范中最早用于声明变量的关键字一直延用自今。但是自从ES6规范中又增加了两种方式之后var声明变量再也不是唯一的和最佳的选择了。那么var声明的变量到底有什么特点呢 1、var 声明的变量是函数作用域
var声明的变量具备函数作用域的特点在函数内部声明的变量只能在函数作用域内部使用在函数外部不能访问。但是在函数内部可以访问函数外部的全局作用域中的变量。关于这一点可以详细学习一下作用域和作用域链。这里不在赘述。 scriptvar num333;function fun(){var age23;//在函数内部声明在函数外部不能访问console.log(age)//23console.log(num);//333,函数内部可以访问全局作用域中的变量num}fun();console.log(age);//报错Uncaught ReferenceError: age is not defined,不能访问函数内部的变量/script2、var声明的变量会有变量提升
在全局作用域中var声明的变量会被提升到全局作用域的最顶端在局部作用域中声明的变量会被提升到局部作用域的最顶端 scriptconsole.log(num);//undefinedvar num333;function fun(){console.log(age);//undefinedvar age23;}fun();/script在上面这段代码中定义了一个全局变量num在函数fun中定义可一个局部变量age。但是都是在变量被声明之前使用打印变量num和age的。但是结果并没有报错而是undefined。说明变量num和age都被提升到变量当前作用域中的最顶端了。可以在变量声明之前使用变量。但是没有多大的意义。
虽然两个变量在声明的时候都赋有初始值但是初始值并没有没打印出来。这是因为使用var声明的变量会被提升但是但是变量的赋值并不会被提升。
3、全局作用域中声明的变量会被挂载到全局对象的window中
以下这段代码分别打印96,96true。 scriptvar num96;console.log(num)//96console.log(window.num);//96console.log(numwindow.num)//true/script4、同一作用域下可以重复声明相同的变量名
同一个作用域下可以使用var声明相同名称的变量前面的值会被后面的值覆盖使用时使用最后声明的变量 scriptvar a23;var a56;var a98;console.log(a);//98/script三、使用let声明变量
1、使用let声明的变量具有块级作用域的特点
ES6 新增的 let 关键字跟 var 很相似但它的作用域是块级的这也是 JavaScript 中的新概念。块级作用域由最近的一对包含花括号{}界定。换句话说if 块、while 块、function 块甚至连单独 的块也是 let 声明变量的作用域。在变量的作用域之外无法访问变量会报错 script{let num36;console.log(num);//36}console.log(num);//报错ReferenceError if(true){let num123;console.log(num1);//23}console.log(num1);//报错ReferenceError while(true){let num369;}console.log(num3);//报错ReferenceError function fun(){let num465;}console.log(num4)//报错ReferenceError /script2、let声明的变量有暂时性死区没有变量提升必须先声明再使用
这一点与var有区别let声明的变量必须先声明再使用。未经声明就使用会报错在 let 声明之前的执行瞬间被称为“暂时性死区”在此阶段引用任何后面才声明的变量都会抛出 ReferenceError。
scriptconsole.log(num)//报错ReferenceErrorlet num96;{console.log(a);//报错ReferenceErrorlet a6;}/script3、全局作用域中使用let声明的变量不会挂载到window对象中
这一点和var也不一样。let声明的全局变量不会放在window中。以下代码分别输出666,undefined,false scriptlet num666;console.log(num);//666console.log(window.num);//undefinedconsole.log(numwindow.num);//false/script4、同一作用域下不能使用let重复声明相同的变量
在相同的额作用域下相同的变量名不能使用let重复声明会报错。但是不同作用域下不受限制 同一作用域下不能使用let重复声明变量 scriptlet num66;let num33;//报错SyntaxError相同作用域下不能重复声明变量/script不同作用域下let可以声明相同变量名的变量 scriptlet num66;function fun(){let num65;{let num63;console.log(num);//63}console.log(num);//65};console.log(num);//66fun();/script相同作用域下不能重复声明并不受var关键字的限制
scriptvar a66;var a99;let a33;//报错SyntaxError
/script在上面这段代码中虽然变量a是使用var关键字声明的但是在同一作用域下再次使用let声明a变量依然会报错不能重复声明
四、使用const声明常量
除了 letES6 同时还增加了 const 关键字。使用 const 声明的变量必须同时初始化为某个值。 一经声明在其生命周期的任何时候都不能再重新赋予新值。
1、const声明常量必须赋初始值
scriptconst a6;//合法有效const b;//报错 SyntaxError必须赋初始值才可以
/script2、const声明的常量不能更改
scriptconst a6;//合法有效a7;//报错不能更改
/script对于const声明的原始数据类型一旦声明变不能更改但是对于引用数据类型虽然不能重新赋值给某个新的引用类型变量。但是操作操作引用数据类型变量中的元素或者属性却是合法的。因为这些操作不会改变引用数据类型的地址。
scriptconst obj{};let o{};//objo;//报错obj.name南山行者;//合法有效console.log(obj);const arr[1,2,3];//arrobj;//报错arr.push(3);//合法有效arr.shift();//合法有效console.log(arr);
/scriptconst除以上这两点不同之外其他的特性与let的特性一致也是具有块级作用域、变量不能提升同一个作用域下不能重复声明等特点。
五、声明变量的其他方式
在JavaScript中还有一种声明变量的方式那就是不使用任何的关键字直接赋值这种方式声明的变量通常被称为隐式全局变量会被挂载到全局对象的window中。但是在实际的开发中不推荐这种方式因为这种方式声明的变量挂载在全局对象中不容易被垃圾回收机制回收容易造成内存泄露 scriptfunction fun(){age32;}fun();console.log(age);//32console.log(window.age);//32console.log(window.ageage);//true{num66;}console.log(num)//66console.log(window.num)//66console.log(window.numnum)//true/script在上面这段代码中变量age和num都不是使用关键字声明的也不是声明再全局中变量但是在全局中却可以访问。因为不使用var,let,const关键字声明的变量叫隐式全局变量挂载到全局对象window中。全局作用域包含的其他任何作用域中都可以访问到。实际开发中应该尽量避免这种声明方式。
六、应用实例
1、for循环中的let和var
scriptfor(var i0;i5;i){}console.log(i);//5
/script在let出现之前都是使用var声明变量而var申明的变量是函数作用域的for循环并不是函数所以var声明的变量会泄露到循环体的外部。如上面这段代码在for循环外部输出变量i得到的结果是5。是循环体执行结束之后的结果。
但是使用let就不会有这种现象因为let声明的变量是块级作用域只能在循坏体内部的块作用域中被访问使用在循环体外部访问会报错也就是说在for循环中使用let声明变量不会泄露到循环体外部
scriptfor(let i0;i5;i){}console.log(i);//报错访问不到
/script2、for循环结合定时器
scriptfor (var i 0; i 5; i) { setTimeout(() { console.log(i)//55555}, 1000) }
/script上面这段代码很多初学者可能会认为输出0,1,2,3,4。然而并不是结果输出的是5,5,5,5,5
之所以会这样是因为setTimeout定时器会在循环结束之后再执行因为定时器是异步的操作循环会先于它执行完毕。当循环执行完了之后循环退出时保存的变量的值就是循环执行结束的值5。这个时候再去执行setTimeout的延时操作获取的变量i都是同一个值5。
如果将循环变量i使用let声明结局会完全不同因为let是块级作用域的。JavaScript引擎会给每个循环生成一个新的循环变量保存在对应的块级作用域中。每个setTimeout引用的都是不同变量的实例。所以输出的结果就是循环执行过程中每个循环变量的值:0,1,2,3,4
scriptfor (let i 0; i 5; i) { setTimeout(() { console.log(i)}, 1000) }
/script3、const的使用
当我们只想声明一个在使用中不被修改的变量时推荐使用const比如for…in和for…of循环
scriptfor (const k in {a: 1, b: 2,c:3}) { console.log(k); } // a, b ,cfor (const v of [行者,23,69,学习]) { console.log(v); } // 行者, 23, 69,学习
/script当然这两个例子只是特例并不是只有这两种情况才可以使用在实际开发中优先推荐使用const
七、推荐使用的声明方式
1、不推荐使用var推荐使用let和const
有了 let 和 const优先使用 let 和 const 有助于提升代码质量因为变量有了明确的作用域、声明位置以及不变的值。
2、优先使用const,其次是let
使用 const 声明可以让浏览器运行时强制保持变量不变也可以让静态代码分析工具提前发现不 合法的赋值操作。推荐优先使用 const 来声明变量只在提前知道未来会有修改时再使用 let。这样可以推断某些变量的值永远不会变同时也能迅速发现因 意外赋值导致的非预期行为或报错。
八、总结
计算机领域的知识日新月异技术更新非常迅速想要在这个领域常足发展保持自己的行业竞争力需要我们时常关注行业技术的革新不断的去学习。但是知识点是死的人是活的在具体使用技术知识点的过程中要根据实际的需求合理选用技术。因为在编程行业没有完美的方案只有趋于完美的方案。
以上是我在实际的开发和使用中对于var,let和const的理解。虽有心尽力表达完善和正确但是难免会有疏漏。若有发现表达不当之处欢迎交流指正。
