2021-07-13 前端知识笔记之JS-var、let、const

最新推荐文章于 2022-08-21 16:46:18 发布
最新推荐文章于 2022-08-21 16:46:18 发布 53 收藏 1
分类专栏： javascript 文章标签： javascript js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44024376/article/details/118693982
版权

前端知识笔记之JS-var、let、const

了解一下ES6之后新增的声明变量的方法与之前的var有什么区别

一、var与let的区别

  • var是函数作用域，let为块级作用域；var在声明变量的时候会成为window的属性，而let则不会；
  • var存在变量额声明提升，而let没有；
  • 在for循环中，var退出循环的时候，迭代变量保存的是退出循环的值，而用let时，后台的js引擎会为每个迭代循环声明一个新的迭代变量，每次都引用的时不同的值。

二、const与let的区别

  • const表示的时不可修改的值，并且在变量初始化的时候必须进行赋值。
阅读终点，创作起航，您可以撰写心得或摘录文章要点写篇博文。去创作
A丶Pure
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
ES6学习笔记之let与const用法实例分析
01-19
本文实例讲述了ES6学习笔记之let与const用法。分享给大家供大家参考，具体如下： 在ES6中不是var，而是通过let来声明变量，用const来声明常量，有如下一些不同： 1、let与const作用域只限于当前代码块{}，而var则...
es6-learning:https
05-15
不再使用VAR，请使用LET和CONST ES6引入了两个用于声明变量的新关键字：let和const。 替换变量var使用let代替，以避免吊起。 常量不应更改，因此请使用const 。 箭 您可以使用箭头=>替换function关键字 老的 ...
js-:JavaScript基础学习笔记总结
03-12
js- JavaScript基础学习笔记总结名称：铭心时间：2021/3/11该内容所有代码可以在控制台进行输出查看结果 :winking_face:持续更新三目运算符 var temperture = 10 ; console . log ( temperture > 15 ? '出门' : '...
java引用传递笔试题abc-ES6-Note:ES6学习笔记
06-20
注：此笔记是我在主要用Swift语言开发，对比整理的一些我感觉常用的功能特性点，匆匆忙忙，粗粗浅浅，以偏概全，仅自以为容易混淆和类比以及不同的知识点。 目 录 var let const var let 区别 var 在以下这样的代码...
深入理解ES6学习笔记之块级作用域绑定
12-09
众所周知，js中的var声明存在变量提升机制，因此ESMAScript 6引用了块级作用域来强化对变量生命周期的控制 let const 声明不会被提升，有几个需要注意的点 1、不能被重复声明 假设作用域中已经存在某个标识符（无论...
Vue3底层响应式原理 二 代理Object
weixin_44024376的博客
08-21 2485
上节说完了响应式系统怎么实现的一些基本远离，并且也实现了一个最基本的响应式系统，接下来就研究一下Vue3中的非基本类型是怎么实现其响应式的。包括如何拦截Object中的in以及for in 操作。还有如何对数组进行代理，对集合类型（Map、Set、WeakMap、WeakSet等）如何进行代理。我们先来讨论对Object的拦截。
Vue3底层响应式原理 一（基础篇）
weixin_44024376的博客
08-14 1221
Vue3底层响应式原理的实现。这一篇我们先了解一下响应式系统的一些基本概念以及怎么去实现一个比较简单响应式系统。
JS中利用a标签实现下载文件功能
weixin_44024376的博客
08-12 760
JS中利用a标签实现下载文件功能 /** * 下载文件函数 模拟<a download></a>属性进行下载 * @param {String} path - 必传 - 下载地址/下载请求地址。 * @param {String} name - 非必传 */ export function downloadFile(path, name) { const xhr = new XMLHttpRequest(); xhr.open("get", path);
JS中new的实现过程
weixin_44024376的博客
08-10 560
JS中new的实现过程 new的过程： 1、在内存中创建一个新的对象； 2 、这个新对象中的[[prototype]]被赋值为传进来的构造函数中的prototype属性； 3、这个新对象中的this指向构造函数； 4、执行构造函数中的代码、 5、将这个新对象返回出去。 代码实现（手写代码）： function myNew(fun) { let newObj = { //第一步：创建一个新的对象 __proto__ = fun.prototype; //第二步：将构造函数中的原型对
前端H5中做移动端适配的方法
weixin_44024376的博客
09-02 466
前端笔记 1、html中的head标签中有那些标签，作用是什么？ title： 文档的标题 base： 不同框架之间代码的整合 link： 引入外部文件 meta： charset属性：规定文档的字符编码使用那种。 content：规定文本的格式 name：viewport 移动端适配 content： width：device-width ：宽度是设备屏幕的宽度 initical-scale： 1.0 ：表示初始时候页面的缩放大小为1.0倍 maximum-scale： 1.0 ：表示允
前端笔记2022-01-05
weixin_44024376的博客
01-05 269
2022-01-05 跨域解决方案 一、JSONP解决跨域 JSONP是利用script中的src无跨域限制来实现，需要后端的支持，并且只能进行get请求。 1、动态创建一个script标签 let script = document.createElement('script); 2、设置script标签中的src属性，将要请求的地址以及回调函数赋值给src script.src = 'http://www.xxx.com/home/callback=callbackName'; let callbac
ES6新特性-Map
weixin_44024376的博客
08-15 236
ES6新特性-Map、WeakMap、Set、WeakSet Map是一种新的集合类型，是一种键值对存储机制。 Map 一、基本API const m = new Map; const m1 = new Map([ ['key1', 'value1'], ['key2', 'value2'], ['key3', 'value3'] ]); 使用new关键字和Map构造函数可以创建一个空映射。 初始化实例时可以给Map构造函数中传入一个可迭代对象，一个需要包含键值对的数组。 1、si
vue中对象的响应式原理
weixin_44024376的博客
07-26 181
2021-7-26号笔记-Vue数据响应式原理 对象的响应式原理 1、 侦听数据 2、 收集依赖 3、 更新数据 过程： 1、在类Observer中，将vue中的data传入构造函数construstot中，进行保存 2、 判断是数组还是对象，如果是对象，就调用walk方法，遍历对象中的key与value，并且传入defineReactive（）方法中。将这些数据变成响应式数据，进行劫持数据。 3、 defineReactive（） 这个方法，首先会对上面遍历出来的val进行判断，如果还是对象，那么在new
LeetCode-Javascript第一题：两数之和
weixin_44024376的博客
08-13 171
最近在B站上观看JS老毕的LeetCode解题，从第一题开始每日跟着练习一题。在CSDN上记录一下解题的思路。方便以后复习。
2021-7-27号笔记-cookie的简单介绍
weixin_44024376的博客
07-26 155
cookie cookie cookie是一种在客户端来保持HTTP状态的方案！ cookie的原理 在用户第一次访问页面的时候，web服务器会在HTTP响应头头中添加一个为set-cookie的响应字段，该字段的形式为key=value的方式。 cookie 的属性 name 与 value ：名与值，用来标识。 expires : 默认情况下，cookie为会话cookie（浏览器关闭cookie就删除了），该属性的值为一个日期：表示该cookie过期事件。 如果设置了该属性，则该cooki
js实现防抖与节流
weixin_44024376的博客
08-10 140
防抖与节流 防抖： 当事件被触发的时候，设定一个周期，如果这个周期之内，这个事件又被触发了，那么就在设定一个周期，一直到这个周期内这个事件不在被触发，才会执行这个事件 手写： function debounce (fun, delay) { //防抖函数需要传入2个参数，一个为事件函数，一个为周期时间 const _this = this; //先将this保存下来，保持this的指向相同 const timer = null; //设定一个定时器，当调用的时候西安清空定时器 retur
盒模型是什么？
weixin_44024376的博客
08-25 126
盒模型是什么？ 一个盒子的盒模型包括margin、border、padding、content四部分。 盒模型有分为标准盒模型与IE盒模型，标准盒模型是指当我们设置width时候，它指的就是content的宽，IE盒模型设置的宽是指border、padding、content三部分的总宽。 在css中可以通过box-sizing属性来设置使用哪种盒模型，content-box是指设置为标准盒模型；border-box指设置为IE盒模型，inherit指的是继承父盒子的box-sizing属性。 ...
浅谈Vue的生命周期
weixin_44024376的博客
07-20 88
浅谈Vue生命周期 首先，什么是生命周期？ 从new Vue 实例被创建再到销毁的整个过程，称为Vue的生命周期。 我们先从官网上了解一下Vue的生命周期图示： [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-N3B5KllN-1626770096213)(https://v3.cn.vuejs.org/images/lifecycle.svg)] 首先，从图上，我们可以了解到的过程为： 首先是new Vue()实例化vue时，初始化事件与生命周期。这个过程分别调用了三
前端笔记8-12
weixin_44024376的博客
08-12 60
前端笔记 typeof与instanceof的区别 typeof可以确定任意变量的数据类型，对一个值使用typeof会返回下列字符串之一： ‘undefined’ 表示值未定义 ‘boolean’ 表示值为布尔值 ‘string’ 表示值为字符串 ‘number’ 表示值为数值 ‘object’ 表示值为对象或者null ‘function’ 表示值为函数 ‘symbol’ 表示值为符号 instanceof可以知道一个引用类型得数据到底是什么类型的对象，该方法返回值为boolean。 insta
js let var const区别
最新发布
06-28
### 回答1： js中，let、var、const都是用来声明变量的关键字，它们的区别如下： 1. var：在ES5中，var是声明变量的关键字，它的作用域是函数级别的，即在函数内部声明的变量只在函数内部有效，而在函数外部声明的变量则在全局范围内有效。在ES6中，var仍然可以使用，但是推荐使用let和const。 2. let：在ES6中，let是声明块级作用域变量的关键字，它的作用域是块级别的，即在块内部声明的变量只在块内部有效。let声明的变量可以被重新赋值，但是不能被重复声明。 3. const：在ES6中，const是声明常量的关键字，它的作用域也是块级别的，与let相同。const声明的变量不能被重新赋值，也不能被重复声明。常量一旦被赋值，就不能再次修改。 总之，let和const是ES6中新增的关键字，它们的作用域是块级别的，比var更加安全和灵活。而const声明的变量是常量，一旦被赋值就不能再次修改。 ### 回答2： JavaScript 是一种动态类型的编程语言，拥有多种变量声明方式，其中包括 let、var 和 const。下面将对它们各自的特点进行比较。 var 在 ES6 之前，var 是 JavaScript 中最常用的变量声明方式之一。var 在声明时没有必要显式表明变量类型，在函数内部声明的变量的作用域范围会自动提升至函数顶部，并在函数外部声明的变量，在全局作用域范围内，都会被认为是 window 对象的属性。 然而，var 存在一些问题：它的作用域是函数级别的。这就意味着，在函数内部声明的变量，在函数体内都可访问，但在函数体外却无法访问。同时，如果重复声明同一个变量名，后续声明会覆盖前面的声明。这可能会导致意外的行为。 let ES6 引入了 let 声明变量的方式，这使得变量的作用域在声明的块级范围内。这意味着，let 声明的变量在声明它的块级作用域范围内可见，但在块级作用域之外不可见。与 var 类似，let 声明的变量是可变的，可以在被声明之后被重新赋值。 let 关键字在 for 循环中的使用也是常见的，因为它可以很容易解决传统的 JavaScript 中闭包的问题。在 for 循环中，let 声明的变量在每次循环中都有新的实例，因此它不会受到循环外任何其他代码的影响。 const const 关键字声明的变量通常被称为常量，常量是一种不能被重新赋值的变量类型。与 let 类似，const 下，变量作用域同样在声明它的块级作用域中。 因此，使用 const 关键字声明的变量只能赋值一次，而且这个值在后续代码中也不能改变。但是，如果一个 const 变量是对象类型，那么它里面的属性可以更改。这是因为 const 变量只是防止变量被重新分配，而不阻止变量内部状态的更改。 总的来说，let 和 const 相比起 var，更加安全和稳定。使用 let 和 const 可以让代码更清晰和易于理解，也可以避免出现不可预料的问题。在实际的开发环境中，开发人员可以根据实际需求选择使用何种变量类型。 ### 回答3： JavaScript中有四种声明变量的方式：let、var、const和class。其中let、var和const是ES6（ECMAScript 2015）引入的新特性，在ES6之前只有var一种变量声明方式。下面来详细介绍这三种声明方式的区别。 1. var声明 var是ES6之前用来声明变量的方式。使用var声明的变量是全局或函数作用域，可以在其声明范围内随意访问。 var a = 'global variable'; function func() { var b = 'local variable'; } console.log(a); // 'global variable' console.log(b); // ReferenceError: b is not defined 2. let声明 let是ES6引入的新的块级作用域声明变量的方式，在声明变量的代码块内生效。 let a = 'global variable'; if (true) { let a = 'local variable'; console.log(a); // 'local variable' } console.log(a); // 'global variable' 在if语句块中使用let声明了变量a，因此在if语句块中可以访问到该变量，而在if语句块外部，变量a指向的是全局变量。 3. const声明 const也是ES6引入的一个新的声明变量的方式，与let一样，const声明的变量也有块级作用域。 const a = 'constant variable'; a = 'new value'; // TypeError: Assignment to constant variable. const声明的变量值不能被修改，因此在上面的代码中尝试修改变量a的值会抛出一个TypeError错误。 总结： var声明的变量是全局或函数作用域，在声明范围内随意访问。 let和const声明的变量都是块级作用域，在声明变量的代码块内生效。let声明的变量可以赋值，而const声明的变量值不可修改。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

A丶Pure

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值