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


Posted in Javascript onFebruary 19, 2017

 之前我们在写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"));

得到如下信息:

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

当不使用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一样不可以重复进行声明.

Javascript 相关文章推荐
JavaScript 的方法重载效果
Aug 07 Javascript
jquery form表单序列化为对象的示例代码
Mar 05 Javascript
javascript数据结构之二叉搜索树实现方法
Nov 25 Javascript
jquery操作select元素和option的实例代码
Feb 03 Javascript
轻松搞定js表单验证
Oct 13 Javascript
详解Vue中一种简易路由传参办法
Sep 15 Javascript
Vue项目中如何引入icon图标
Mar 28 Javascript
bootstrap中日历范围选择插件daterangepicker的使用详解
Apr 17 Javascript
vue实现匀速轮播效果
Jun 29 Javascript
JS轮播图的实现方法2
Aug 25 Javascript
原生js中运算符及流程控制示例详解
Jan 05 Javascript
JavaScript 判断浏览器是否是IE
Feb 19 Javascript
jQuery实现一个简单的轮播图
Feb 19 #Javascript
js 博客内容进度插件详解
Feb 19 #Javascript
ajax接收后台数据在html页面显示
Feb 19 #Javascript
Boostrap栅格系统与自己额外定义的媒体查询的冲突问题
Feb 19 #Javascript
JavaScript中无法通过div.style.left获取值的解决方法
Feb 19 #Javascript
JS获取浮动(float)元素的style.left值为空的快速解决办法
Feb 19 #Javascript
Angular 输入框实现自定义验证功能
Feb 19 #Javascript
You might like
给php新手谈谈我的学习心得
2007/02/25 PHP
PHP+Ajax实时自动检测是否联网的方法
2015/07/01 PHP
php数值计算num类简单操作示例
2020/05/15 PHP
php命令行模式代码实例详解
2021/02/26 PHP
如何在Mozilla Gecko 用Javascript加载XSL
2007/01/09 Javascript
【消息提示组件】,兼容IE6/7&&FF2
2007/09/04 Javascript
jquery checkbox全选、取消全选实现代码
2010/03/05 Javascript
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
原生js ActiveXObject获取execl里面的值
2013/11/01 Javascript
JsRender for object语法简介
2014/10/31 Javascript
node.js中的buffer.Buffer.byteLength方法使用说明
2014/12/10 Javascript
简介JavaScript中的unshift()方法的使用
2015/06/09 Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
2015/08/20 Javascript
全面理解JavaScript中的闭包
2016/05/12 Javascript
全面了解构造函数继承关键apply call
2016/07/26 Javascript
微信小程序之小豆瓣图书实例
2016/11/30 Javascript
vue2中使用sass并配置全局的sass样式变量的方法
2018/09/04 Javascript
vue 对象添加或删除成员时无法实时更新的解决方法
2019/05/01 Javascript
原生js实现下拉框选择组件
2021/01/20 Javascript
python 读取excel文件生成sql文件实例详解
2017/05/12 Python
tensorflow TFRecords文件的生成和读取的方法
2018/02/06 Python
Python自动发送邮件的方法实例总结
2018/12/08 Python
对Python3之进程池与回调函数的实例详解
2019/01/22 Python
Python遍历字典方式就实例详解
2019/12/28 Python
python实现发送邮件
2021/03/02 Python
Sneaker Studio法国:购买运动鞋
2018/06/08 全球购物
五年后的职业生涯规划
2014/03/04 职场文书
求职简历自我评价2015
2015/03/10 职场文书
责任书范本大全
2015/05/11 职场文书
三八节活动简报
2015/07/20 职场文书
学校少先队工作总结
2015/08/12 职场文书
2016年公司新年寄语
2015/08/17 职场文书
大学三好学生主要事迹范文
2015/11/03 职场文书
2019年大学生职业生涯规划书最新范文
2019/03/25 职场文书
熟背这些句子,让您的英语口语突飞猛进(135句)
2019/09/06 职场文书
Java 写一个简单的图书管理系统
2022/04/26 Java/Android