JS变量中有var定义和无var定义的区别以及es6中let命令和const命令

发布时间 - 2026-01-10 23:09:23    点击率:

 之前我们在写js代码的时候都知道可以用var定义全局变量和局部变量,也可以省略var,而且在非严格模式下不会报错,但是并不知道两者的区别...

var x = 1;
y = 4;
console.log(x);//1
console.log(y);//4
console.log(window.x);//1
console.log(window.y);//4

简单测试下可以知道定义的x和y都被挂载在window对象上,变为window下的属性,这并不能说明什么...

delete x;
delete y;
console.log(window.x);//1
console.log(window.y);//undefined

再看看执行上面代码之后x属性没有被删除,y被删除了,这是区别就来了

在通过var进行定义后的变量不能被delete删除,这是什么原因?ECMAScript 5标准中,可以通过Object.getOwnPropertyDescriptor()来获取对象自身某个property的属性信息:

console.log(Object.getOwnPropertyDescriptor(window,"x"));
console.log(Object.getOwnPropertyDescriptor(window,"y"));

得到如下信息:

当不使用var进行定义是,变量默认的configurable为true,可以进行delete等命令进行操作,而当var在定义一个全局变量的时候configurable 变为了false,即不会被delete删除.

此外,简单说一下关于变量提升问题

alert(a);//Uncaught ReferenceError: a is not defined
a = 100;alert(b);//undefined

var b = 200;先说第二段代码,var声明的全局变量b在js中会进行代码提升,也就是说var b = 200;会被分解为var b;b=200;代码解析的第时候会将var b;提升到最前面,并且在内存中开辟一个空间,由于b没有被赋值,默认为undefined.第一段代码中当js执行alert()函数时候由于没有进行var声明,变量没有被提升,不存在内存开辟,所以在alert时候直接报错!

在ECMAScript6标准中,一个重要的概念就是"JavaScript严格模式",需要在最前面加上"use strict";

let注意点:

1.let拥有块级作用域,一个{}就是一个作用域

2.let在其作用域下面不存在变量提升

3.let在其作用域中不能被重复声明(函数作用域和块级作用域)

第一点:let的块级作用域

注意:以下代码都在严格模式下执行的

let n = 10;
if(true){
 let n = 50;
}
console.log(n);//10表示外层代码块不受内层代码块的影响,如果是用var定义的变量n,那么输出的就是修改后的50.

第二点:变量提升问题

alert(a);//Uncaught ReferenceError: a is not defined
let a = 100;

不同var,let不存在变量提升,以上写法会直接报错.

第三点:重复声明问题

(function(){
 let lTest = "let";
 var vTest = "var"
 let lTest = "let changed";//Uncaught SyntaxError: Identifier 'lTest' has already been declared
 var vTest = "var changed";
 console.log(lTest);
 console.log(vTest);
})();

let在同一个作用域下不允许进行重复变量声明.否则也是直接报错!!!

const命令

const用来声明常量,一旦声明,其值就不可以更改,如果你非得修改变量的值,js不会报错,只是默默表示失败(不起作用)

const的作用域与let相同,只在声明所在的块级作用域内有效,并且也是和let一样不可以重复进行声明.


# var  # let  # const  # js  # JavaScript中const、var和let区别浅析  # JavaScript ES6中const、let与var的对比详解  # 5分钟快速掌握JS中var、let和const的异同  # 深入浅析var  # const的异同点  # JavaScript中关键字 var、let、const的区别详解  # JavaScript变量声明var  # let.const及区别浅析  # 了解javascript中let和var及const关键字的区别  # js中var  # const的区别及相关面试题讲解  # 报错  # 不存在  # 全局变量  # 最前面  # 这是  # 如果你  # 来了  # 都在  # 就不  # 模式下  # 可以用  # 不可以  # 可以通过  # 不受  # 只在  # 一个重要  # 三点  # 会将  # 再看看  # 先说 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 南京网站制作费用,南京远驱官方网站?  Java Adapter 适配器模式(类适配器,对象适配器)优缺点对比  微信小程序 input输入框控件详解及实例(多种示例)  Laravel集合Collection怎么用_Laravel集合常用函数详解  详解jQuery中的事件  Laravel Session怎么存储_Laravel Session驱动配置详解  Laravel如何集成第三方登录_Laravel Socialite实现微信QQ微博登录  大学网站设计制作软件有哪些,如何将网站制作成自己app?  Claude怎样写结构化提示词_Claude结构化提示词写法【教程】  奇安信“盘古石”团队突破 iOS 26.1 提权  如何在橙子建站上传落地页?操作指南详解  Laravel怎么实现一对多关联查询_Laravel Eloquent模型关系定义与预加载【实战】  电商网站制作多少钱一个,电子商务公司的网站制作费用计入什么科目?  Laravel如何发送系统通知?(Notification渠道示例)  linux写shell需要注意的问题(必看)  Python自然语言搜索引擎项目教程_倒排索引查询优化案例  HTML5空格在Angular项目里怎么处理_Angular中空格的渲染问题【详解】  Laravel如何处理JSON字段_Eloquent原生JSON字段类型操作教程  Laravel如何使用Seeder填充数据_Laravel模型工厂Factory批量生成测试数据【方法】  Edge浏览器怎么启用睡眠标签页_节省电脑内存占用优化技巧  Win11搜索栏无法输入_解决Win11开始菜单搜索没反应问题【技巧】  大连网站制作公司哪家好一点,大连买房网站哪个好?  Laravel怎么解决跨域问题_Laravel配置CORS跨域访问  Bootstrap整体框架之JavaScript插件架构  如何在HTML表单中获取用户输入并结合JavaScript动态控制复利计算循环  JS经典正则表达式笔试题汇总  JavaScript如何实现继承_有哪些常用方法  黑客如何通过漏洞一步步攻陷网站服务器?  js实现获取鼠标当前的位置  如何在 Go 中优雅地映射具有动态字段的 JSON 对象到结构体  HTML5打空格有哪些误区_新手常犯的空格使用错误【技巧】  PythonWeb开发入门教程_Flask快速构建Web应用  Laravel怎么使用Blade模板引擎_Laravel模板继承与Component组件复用【手册】  如何用腾讯建站主机快速创建免费网站?  Python面向对象测试方法_mock解析【教程】  高端网站建设与定制开发一站式解决方案 中企动力  Laravel怎么生成URL_Laravel路由命名与URL生成函数详解  微信h5制作网站有哪些,免费微信H5页面制作工具?  北京企业网站设计制作公司,北京铁路集团官方网站?  Laravel如何操作JSON类型的数据库字段?(Eloquent示例)  HTML透明颜色代码怎么让图片透明_给img元素加透明色的技巧【方法】  Laravel怎么实现观察者模式Observer_Laravel模型事件监听与解耦开发【指南】  详解阿里云nginx服务器多站点的配置  音响网站制作视频教程,隆霸音响官方网站?  如何利用DOS批处理实现定时关机操作详解  java获取注册ip实例  jQuery validate插件功能与用法详解  独立制作一个网站多少钱,建立网站需要花多少钱?  如何用AWS免费套餐快速搭建高效网站?  Laravel怎么使用Intervention Image库处理图片上传和缩放