【vue-小知识】var、let 和 const之间的区别

文章目录

  • 结论
  • 1、重复定义变量名
      • var:允许重复定义变量名
      • let和const:不可以重复定义变量名
  • 2、修改值
      • var:允许修改值
      • let:允许修改值
      • const:不允许修改值,会报错
  • 3、变量提升
      • var : 支持变量提升
      • let和const:不支持,会报错
  • 4、作用域
      • var : 全局变量
      • let: 局部变量
      • const: 声明常量不能进行修改

结论

  • 根据实际场景使用: 最小粒度使用命令
重复定义修改值变量提升(先使用后定义)作用域
var允许允许允许全局
let-允许-局部
const (常量)---

主要从

  • 是否可以重复定义变量名
  • 是否允许修改值
  • 是否具有变量提升
  • 作用域

这四个方面来进行介绍。

1、重复定义变量名

var:允许重复定义变量名

我先定义一个变量a,给它附上一个初始值,我们打印一下结果
之后我们对这个变量进行重复的定义,再打印一下结果
发现初始值被覆盖了

所以说var是可以重复定义变量名的。

let和const:不可以重复定义变量名

直接就报错了

2、修改值

var:允许修改值

首先我们定义一个变量给它附上一个初始值,然后对这个变量附上一个新的值。
我们打印一下这个变量的值,发现这个变量的值的确被修改了

let:允许修改值

const:不允许修改值,会报错

这是因为const所定义的变量是常量,是不允许被修改的。

3、变量提升

  • 通常:先定义变量,然后再去使用变量

  • 变量提升:可以让你先使用变量,之后再去定义变量

var : 支持变量提升

在使用a变量之前并没有定义这个变量.
是在使用之后才进行定义的。
但是整个代码依然能够运行。
但是它的结果似乎和我们的预期不太一样,它的结果是undefined。

  • 可以理解为做了如下的处理

这就是变量提升,是var所定义的变量特有的。

let和const:不支持,会报错

4、作用域

var : 全局变量

  • 默认全局变量
  • 缺省的定义是全局变量
var hw = 'hello word';
console.log("hw=" + hw);
hwAll = "hello All";
console.log("hw=" + hw);
for (var index = 0; index < 1; index++) {var inCon = "inCon";console.log("index" + index+",hw=" + hw + ",inCon="+inCon);
}
console.log(",inCon="+inCon);

let: 局部变量

  • 仅在方法内有效
for (let index = 0; index < 1; index++) {let inConLet = "inConLet";console.log("index" + index+",hw=" + hw + ",inConLet="+inConLet);
}
  • 如果不在作用域会报异常
D:\vuecode\es6\hw.js:20
console.log(",inConLet="+inConLet);^ReferenceError: inConLet is not definedat Object.<anonymous> (D:\vuecode\es6\hw.js:20:26)at Module._compile (internal/modules/cjs/loader.js:1158:30)at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)at Module.load (internal/modules/cjs/loader.js:1002:32)at Function.Module._load (internal/modules/cjs/loader.js:901:14)at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)at internal/main/run_main_module.js:18:47

const: 声明常量不能进行修改

  • 声明常量不能进行修改
for (let index = 0; index < 1; index++) {let inConLet = "inConLet";console.log("index" + index+",hw=" + hw + ",inConLet="+inConLet);
}
  • 如果不在作用域会报异常
TypeError: Assignment to constant variable.at Object.<anonymous> (D:\vuecode\es6\hw.js:25:5)at Module._compile (internal/modules/cjs/loader.js:1158:30)at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)at Module.load (internal/modules/cjs/loader.js:1002:32)at Function.Module._load (internal/modules/cjs/loader.js:901:14)at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)at internal/main/run_main_module.js:18:47

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/763113.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

吃瓜Grok大模型

段子区 今年当地时间2月29日晚&#xff0c;马斯克闹出来一件大事——正式起诉OpenAI和Sam Altman&#xff0c;并要求OpenAI 恢复开源GPT-4等模型。国际流量大师我只付服马斯克和川宝!&#xff01; 当大家觉得这扯皮的故事就此结束后&#xff0c;马斯克“不负众望”的整了一个大…

【网络取证箱】网络取证在线分析工具箱

【网络取证箱】网络取证在线分析工具箱 在线网站查询工具箱&#xff0c;没什么介绍的&#xff0c;所见即所得&#xff0c;在本文档里补充了其它一些网络安全资源&#xff0c;请忽用于非法活动&#xff0c;仅供学习研究—【蘇小沐】 &#xff08;一&#xff09;Whois查询 主要…

docker 进入容器内部命令

docker容器运行了&#xff0c;怎么进入容器内部查看内部的文件情况呢&#xff1f; 答&#xff1a;可以通过docker exec 的命令查看。 docker exec --help 可以查看命令介绍 &#xff1a; docker exec -it XXX /bin/bash XX为容器ID 进入容器内部 /bin/bash是需要添加的 不…

Java NIO和IO之间的区别

前言 NIO&#xff08;New IO&#xff09;&#xff0c;这个库是在JDK1.4中才引入的。NIO和IO有相同的作用和目的&#xff0c;但实现方式不同&#xff0c;NIO主要用到的是块&#xff0c;所以NIO的效率要比IO高很多。在Java API中提供了两套NIO&#xff0c;一套是针对标准输入输出…

Vue3中基本数据类型为什么需要.value,,,引用类型不需要.value

1、在v3中使用基本数据类型&#xff08;如数字、字符串、布尔值&#xff09;时&#xff0c;如果你希望响应式地更新数据并触发视图更新,需要使用ref包裹基本数据类型,然后将基本数据类型转化为响应式对象;- - - 因此当你使用ref包裹基本数据类型时,实际上得到的是一个包含.valu…

B002-springcloud alibaba 微服务环境搭建

目录 创建父工程创建基础模块创建用户微服务创建商品微服务创建订单微服务微服务调用 创建父工程 新建项目springcloud-alibaba&#xff0c;本工程不需要写代码&#xff0c;删除src 导包 <parent><groupId>org.springframework.boot</groupId><artifact…

Linux上Mysql安装和部署(图文结合超详细)

1、首先将虚拟机装成功&#xff08;这里不做演示&#xff09; 2、df-h 查看光盘是否挂载&#xff0c;已挂载进行下一步&#xff0c;未挂载手动挂载 2.1、手动挂载 mount -o ro /dev/sr0 /media3、进入etc/yum.repos.d目录查看仓是否配置&#xff0c;若配置进行下一一步&#…

360企业安全浏览器兼容模式显示异常某个内容不显示 偶发现象 本地无法复现情况js

360企业安全浏览器兼容模式显示异常 &#xff0c;现象测试环境频发 &#xff0c;本地连测试无法复现&#xff0c;线上反馈问题。 出现问题的电脑为windows且使用360企业安全浏览器打开兼容模式可复现 复现过程&#xff1a; 不直接点击超链接跳转页面 &#xff0c;登录后直接通…

C++ 侯捷 程序设计(Ⅱ)兼谈对象模型 笔记

Conversion function 转换函数 侯捷老师使用分数 Fraction举例&#xff0c;分数理应可以被看作是小数 提供了Fraction类对象一个转换为double的方法&#xff0c;当碰到需要转换为double的情况下&#xff0c;会调用该方法。 黄色的就是转换函数&#xff0c;没有return type&am…

Python+appium自动化测试之如何控制App的启动和退出

由于本人使用的是Android设备做自动化测试&#xff0c;所以以下内容均基于Android系统做出的整理 一、启动app 启动app需要设置Capability参数&#xff0c;而Capability参数放在Desired Capalibity中&#xff0c;Desired Capalibity告诉Appium想要的自动化平台和应用程序&…

Flutter与Xamarin跨平台APP开发框架的区别

嘿&#xff0c;各位亲爱的朋友们&#xff01;大家好&#xff0c;我是咕噜铁蛋&#xff01;今天我们要探讨的话题是&#xff1a;Flutter与Xamarin这两款热门的跨平台APP开发框架。我深知选择合适的开发工具对于开发者来说有多么重要。那么&#xff0c;当我们需要开发跨平台应用时…

【机器学习】基于正余弦搜索算法优化的BP神经网络分类预测(SCA-BP)

目录 1.原理与思路2.设计与实现3.结果预测4.代码获取 1.原理与思路 【智能算法应用】智能算法优化BP神经网络思路【智能算法】正余弦优化算法&#xff08;SCA&#xff09;原理及实现 2.设计与实现 数据集&#xff1a; 多输入多输出&#xff1a;样本特征24&#xff0c;标签类…

高德地图——轨迹回放和电子围栏

功能点 地图的初始化显示电子围栏&#xff08;先初始化在调接口显示电子围栏&#xff09;显示定位显示轨迹轨迹回放 &#xff08;回放速度无法控制是因为高德地图的版本问题&#xff0c;不要设置版本&#xff0c;使用默认的即可生效&#xff09;获取当前城市及天气情况设置地图…

【漏洞复现】金和OA IncentivePlanFulfill.aspx SQL注入漏洞

0x01 产品简介 金和OA协同办公管理系统C6软件&#xff08;简称金和OA&#xff09;&#xff0c;本着简单、适用、高效的原则&#xff0c;贴合企事业单位的实际需求&#xff0c;实行通用化、标准化、智能化、人性化的产品设计&#xff0c;充分体现企事业单位规范管理、提高办公效…

黑马现有java课程框架及其功能梳理

目录 高并发相关提高通信效率Netty作用&#xff1a;哪些框架使用它&#xff1a; ChannelChannelHandler 和 ChannelPipelineEventLoop 和 EventLoopGroup**涉及的名词解释&#xff1a;**NIOSocketNginx 高并发相关 主要用来解决IO密集型程序&#xff08;大量文件读写&#xff…

盲盒小程序有什么优势?如何运营获客?

盲盒作为当下的热门行业&#xff0c;已经在国内外成功站稳脚步&#xff0c;市场规模庞大。 线上盲盒小程序也是互联网电商下的新模式&#xff0c;将传统的盲盒模式与线上电商模式相结合&#xff0c;为消费者提供一种新颖额盲盒购买体验&#xff0c;玩家在手机上就可以体验到抽…

HTML5+CSS3小实例:具有悬停效果的3D闪耀动画

实例:具有悬停效果的3D闪耀动画 技术栈:HTML+CSS 效果: 源码: 【HTML】 <!DOCTYPE html> <html lang="zh-CN"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, init…

2024年卫生巾行业市场分析报告(京东天猫淘宝线上卫生巾品类电商数据查询)

最近&#xff0c;相关部门辟谣了一则“十大致癌卫生巾黑名单”的消息。这个榜单是部分博主AI撰写&#xff0c;为博眼球、蹭热度的结果。此次事件势必会对卫生巾行业产生一定影响&#xff0c;加剧行业竞争。 根据鲸参谋电商数据平台显示&#xff0c;2024年1月至2月线上电商平台…

从内存巷弄到指针大道(一)

文章目录 1.内存和地址1.1理解内存地址酒店大堂&#xff1a;内存的入口房间号&#xff1a;内存地址的意义酒店的楼层划分&#xff1a;内存的结构酒店的房间单位&#xff1a;计算机中的常见单位 1.2如何理解编址 2.指针变量和地址2.1取地址操作符&#xff08;&)2.2 指针变量…

二、typescript基础语法

一、条件语句 二、函数 1、有名函数 function add(x:number, y:number):number {return x y;}2、匿名函数 let add function (x:number, y:number):number {return x y;}函数可选参数 function buildName(firstname: string, lastname?:string) {if (lastname) {return fi…