let、const、var的区别,解构赋值,箭头函数

news2024/9/30 5:29:53

let、const、var的区别

  • 使用var声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象。
  • 使用let声明的变量,其作用域为该语句所在的代码块内,不存在变量提升。
  • 使用const声明的是常量,在后面出现的代码块中,不能在修改改常量的值。

var

let

const

函数级作用域

块级作用域

块级作用域

变量提升

不存在变量提升

不存在变量提升

值可改

值可改

值不可改

解构赋值

数组解构赋值

ES6中允许从数组中提取值,按照对应的位置,对应的变量赋值。对象也可以实现解构

示例

   <script>
        // 数组解构赋值 允许从数组中提取值,按照对应的位置,对应的变量赋值
        let ary = [1, 2, 3];
        let [a, b, c, d] = ary;
        // let [a, b, c] = [1, 2, 3];
        console.log(a);//1
        console.log(b);//2
        console.log(c);//3
        console.log(d);//undefined
    </script>

 

 对象解构

 <script>
        // 对象解构 允许我们使用变量的名字匹配对象的属性 匹配成功将对象属性的值赋值给变量
        let person = { name: '王五', age: 20, sex: '男' };
        let { name, age, sex } = person;
        console.log(name);//zhangsan 相当于 let neme = person.name
        console.log(age);//20  相当于 let age = person.age
        console.log(sex);
        // 写法2
        let { name: myName } = person;
        console.log(myName);
    </script>

 

箭头函数

ES6中新增的函数方式。     

语法:

() => {}          // () 还是放形参的地方  {}还是函数体
const fn = () => {}

小技巧:

  • 在箭头函数中函数体如果只有一句代码,且执行结果就是返回值,此时可以省略大括号 {}
  • 如果形参只有一个,可以省略小括号()

示例

<script>
        // 箭头函数是用来简化函数定义语法的
        const fn = () => {
            console.log(123);
        }
        fn();

        // const sum = (num1, num2) => {
        //     return num1 + num2;
        // }
        // 在箭头函数中函数体如果只有一句代码,且执行结果就是返回值,此时可以省略大括号和 return 
        const sum = (num1, num2) => num1 + num2;
        const result = sum(2, 3);
        console.log(result);
        // 如果形参只有一个, 可以省略小括号
        const fun = v => alert(v);
        fun(20);
    </script>

箭头函数中的this指向

箭头函数不绑定this关键字,箭头函数中的this,指向的是函数定义位置的上下文this

示例 

 <script>
        // 箭头函数不绑定this 也就是说它没有自己的this关键字,如果在箭头函数中使用this
        // this关键字指向箭头函数 定义位置中的this(它父级的this)
        const obj = { name: '张三' }
        function fn() {
            console.log(this);
            return () => {
                console.log(this);
            }
        }
        const resFn = fn.call(obj);// 指向 obj
        resFn();//也是obj 因为这里的箭头函数指向 fn函数但 fn函数指向 obj 所以箭头函数也
        // 指向obj 
    </script>

 

 

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

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

相关文章

Go语言核心编程-运算符和进制转换

第 4 章 运算符 4.1 运算符的基本介绍 运算符是一种特殊的符号&#xff0c;用以表示数据的运算、赋值和比较等 运算符是一种特殊的符号&#xff0c;用以表示数据的运算、赋值和比较等 算术运算符赋值运算符比较运算符/关系运算符逻辑运算符位运算符其它运算符 4.2 算术运算符…

体验联网版 ChatGPT:优点和缺点同样明显,还藏着无限可能

ChatGPT 有点像古希腊的阿喀琉斯&#xff1a;它很强大&#xff0c;却有个致命的弱点——无法联网&#xff0c;这注定了它只能是一个停留在 2021 年的超人。 但很快&#xff0c;我们将等到一个「鱼和熊掌兼得」的时刻。 通过插件集的 Web browsing 功能&#xff0c;ChatGPT 就…

C++每日一练:贝博士的机械零件(补全题目)奇偶排序(巧妙快排)寻因找祖

文章目录 前言一、贝博士的机械零件1、题目2、解法 二、奇偶排序&#xff08;巧用快排&#xff09;三、寻因找祖 前言 今天的题目中寻因找祖最难了&#xff0c;明显的数学题&#xff0c;笔者这数学文盲水平肯定不会&#xff0c;用暴力搞了一波&#xff0c;只有50%。就去考察学…

(二十六)ATP应用测试平台——将一个微服务打包成含skywalking链路追踪的docker镜像

前言 延续前面的章节内容&#xff0c;本节内容我们以ht-atp的springboot应用为例&#xff0c;封装一个包含skywalking链路追踪的微服务docker应用。完成服务调用的链路追踪监控。skywalking采用字节码注入的方式实现代码的无侵入&#xff0c;探针采集数据粒度粗&#xff0c;但…

详解c++STL—容器set/multiset

目录 1、set基本概念 1.1、功能 1.2、本质&#xff1a; 1.3、set和multiset区别 2、set构造和赋值 2.1、功能描述 2.1、构造 2.3、赋值 2.4、示例 3、set大小和交换 3.1、功能描述 3.2、函数原型 3.2、示例 4、set插入和删除 4.1、功能描述 4.2、函数原型 4.3…

YOLO V3 SPP ultralytics 第一节:VOC 的标注文件(xml)转YOLO标注格式(txt)以及如何自定义YOLO数据样本

目录 1. 前言 2. 关于PASCAL VOC数据集xml --> YOLO txt格式 2.1 路径设定 2.2 读取xml 文件的函数 2.3 xml ---> yolo txt 2.4 yolo 的label文件 2.6 结果 2.7 代码 3. 自定义 YOLO 数据集 3.1 预备工作 3.2 打开labelimg 3.3 绘制 代码参考是b站的大佬&…

CNNs: ZFNet之CNN的可视化网络介绍

CNNs: ZFNet之CNN的可视化网络介绍 导言Deconvnet1. Unpooling2. ReLU3. Transpose conv AlexNet网络修改AlexNet Deconv网络介绍特征可视化 导言 上一个内容&#xff0c;我们主要学习了AlexNet网络的实现、超参数对网络结果的影响以及网络中涉及到一些其他的知识点&#xff0…

RedisInsight—Redis可视化工具

到处都是各种redis的可视化工具&#xff0c;但是那个是redis官网推荐的呢。 答案是&#xff1a;RedisInsight。 好用吗&#xff1f;自己看看吧。反正下载是挺烦躁的。 RedisInsight介绍 RedisInsight支持多种操作系统&#xff1a;Linux、Windows和macOS。 RedisInsight支持…

全网最牛最全面的jmeter教程之jmeter对图片验证码的处理

jmeter对图片验证码的处理 在web端的登录接口经常会有图片验证码的输入&#xff0c;而且每次登录时图片验证码都是随机的&#xff1b;当通过jmeter做接口登录的时候要对图片验证码进行识别出图片中的字段&#xff0c;然后再登录接口中使用&#xff1b; 通过jmeter对图片验证码…

【数据结构】C语言实现堆及其应用

二叉树的顺序结构--堆 一、堆的概念与实现堆的概念堆结构定义堆的初始化与销毁堆的插入与向上调整堆的打印、判空、元素个数size、堆顶元素堆的删除与向下调整大根堆与小根堆的写法区别堆的两种建立方式建堆的时间复杂度推导 二、堆的应用堆的应用--topK堆的应用--堆排序优先级…

learn_C_deep_11 (深刻理解整形提升、左移和右移规则、花括号、++和--操作、表达式匹配:贪心算法)

目录 深刻理解整形提升 左移和右移规则 如何理解"丢弃" 一个问题 0x01<<23 的值是多少 花括号 、--操作 表达式匹配&#xff1a;贪心算法 深刻理解整形提升 #include <stdio.h> int main() {char c 0;printf("sizeof(c): %d\n", sizeo…

C++系列之类与对象(上)

&#x1f497; &#x1f497; 博客:小怡同学 &#x1f497; &#x1f497; 个人简介:编程小萌新 &#x1f497; &#x1f497; 如果博客对大家有用的话&#xff0c;请点赞关注再收藏 &#x1f31e; 类 类的概念 C是基于面向对象的&#xff0c;是对象与对象之间的交互完成的&am…

docker构建PHP环境

docker构建PHP环境 文章目录 docker构建PHP环境下载镜像构建本地目录创建容器配置补充命令解释设置docker启动时启动容器 下载镜像 # php 镜像 docker pull php:7.4-fpm # nginx镜像 docker pul nginx:lates # 检查下载的镜像 docker images构建本地目录 本次构建是在win系统…

怎么查营业执照经营范围

怎么查营业执照经营范围 1.到企业公司所在地查询。一般工商局都要求公司将营业执照正本悬挂于企业办公室醒目位置,在公司工商营业执照正副本中均有描述。 2.登陆国家工商管理网站查询。可以登陆开具发票单位所在的工商行政管理局网站,输入企业名称就可以查询法人、企业类型、经…

第七章 中断

中断是什么&#xff0c;为什么要有中断 并发是指单位时间内的累积工作量。 并行是指真正同时进行的工作量。 一个CPU在一个时间只能执行一个进程&#xff0c;任何瞬间任务只在一个核心上运行。 而CPU外的设备是独立于CPU的&#xff0c;它与CPU同步运行&#xff0c;CPU抽出一点…

2023年十大最佳黑客工具!

​用心做分享&#xff0c;只为给您最好的学习教程 如果您觉得文章不错&#xff0c;欢迎持续学习 在今年根据实际情况&#xff0c;结合全球黑客共同推崇&#xff0c;选出了2023年十大最佳黑客工具。 每一年&#xff0c;我都会持续更新&#xff0c;并根据实际现实情况随时更改…

山西煤矿电子封条算法 opencv

山西煤矿电子封条通过pythonopencv网络模型AI视觉技术&#xff0c;pythonopencv算法模型实现对出入井人监察控制、调度室空岗识别、生产作业状态、摄像头遮挡、挪动角度识别、货运车辆出矿识别等。 OpenCV的全称是Open Source Computer Vision Library&#xff0c;是一个跨平台…

CleanMyMac X如何下载解锁完整版本?

这是一款很受到mac用户喜爱的清理软件。不仅清理文件的步骤十分简单&#xff0c;电脑小白用户也可以高效清理Mac电脑。作为一款全方位保护电脑的软件&#xff0c;CleanMyMac已经不满足于只做简单的Mac清理工具&#xff0c;而是为mac用户提供更多的实用功能&#xff1a;优化系统…

机器学习随记(7)——bootstrap、bagging、boosting、随机森林

bootstrap&#xff1a;是一种统计方法&#xff0c;也是一种思想&#xff0c;简单说就是在所有样本集中进行有放回地抽样&#xff0c;抽取n个样本。如果不清楚样本的分布&#xff0c;bootstrap是一种合适的方法。 bagging&#xff1a;Bagging方法在训练过程中&#xff0c;各基分…

windows提权

权限提升概述 1、提权介绍 权限提升&#xff1a;攻击者通过安全漏洞把获取到的受限制的低权限用户突破限制&#xff0c;提权至高权限的管理员用户&#xff0c;从而获取对整个系统的控制权 windows&#xff1a;user --> system/administrator linux&#xff1a;user --&g…