当前位置: 首页 > news >正文

66-ES6:var,let,const,函数的声明方式,函数参数,剩余函数,延展操作符

1.JavaScript语言的执行流程

编译阶段:构建执行函数;执行阶段:代码依次执行

2.代码块:{   }

3.变量声明方式var

有声明提升,允许重复声明,声明函数级作用域

访问:声明后访问都是正常的,在声明之前访问值为undefined

(对于变量来说,变量允许使用的范围被称为作用域)

    <script>//for(表达式1;表达式2;表达式3)//表达式1 执行1次//表达式2 执行n+1次//表达式3 执行n次for(var i = 0;i<10;i++){console.log(i);}debugger;//此处可以访问到i变量,可以证明var声明的变量是函数级作用域console.log('循环后输出i变量的值',i)//10</script>

4. ES6新增的变量声明方式let

没有声明提升,不允许重复声明但允许重新赋值,声明块及作用域 

访问:声明前不允许访问

(变量访问时,如果当前作用域不存在,则沿作用域向上级作用域查找,找到即返回,直到全局作用域未找到返回undefined)

    <script>//console.log('let声明变量a:',a);//Cannot access 'a' before initializationlet a = 10;// let a = 100;// Identifier 'a' has already been declareda = 100; //允许重新赋值{let a = 100;//此处通过let声明变量a,作用域仅限于当前代码块内部,所以let声明的变量是块及作用域console.log('代码块中let a=',a);//代码块中let a= 100debugger;//用于调试JS代码}console.log('a',a);//a 100</script>
    <script>for(let i = 0;i<10;i++){console.log(i);//1,2,3,4,5,6,7,8,9}console.log('循环后输出i变量的值',i);//此处访问的是全局变量i,所以报错</script>

5.变量声明方式const

声明前必须复制,不允许重复赋值,块级作用域,不存在变量提升

暂时性死区:声明(编译阶段)到赋值(执行阶段)之间的区域被称为暂时性死区

    <script>/***    - JS中的数据类型*      - 数值类型*      - Number,String,Boolean,Null,Undefined*      - 引用类型*      - Array,Object*  对于引用类型来说,通过地址修改属性的值,不是重新赋值*  const修饰的是变量的特征,而不是对象的特征*///声明时必须赋值const a = 10;{const a = 100;console.log(a);//100}//a = 200;//报错,常量不允许重新赋值console.log(a);//10//对于引用类型来说,变量中存储的地址改变了,才是重新赋值const obj = {name:'张三',age:18}//通过obj修改了name属性的值obj.name = '李四';//obj = [4,5,6];//报错,因为变量的值不能改变console.log(obj);//age:18,name:"李四"</script>

6.函数的声明方式

6.1new Function()构造函数形式

      // new Function()构造函数形式let fn1 = new Function('return 1');console.log(fn1.toString());//function anonymous() {return 1};

6.2function函数声明

声明前置(提升),可以在声明前调用,必须拥有函数名,并且函数名符合标识规范

    <script>//function函数声明fn2();//输出fn2 executedfunction fn2(){console.log('fn2 executed');return 2;}fn2();//输出fn2 executed</script>

6.3函数表达式let fn() = function(){}

    <script>fn3();//报错,var fn3相当于变量提升,值为undefind,不是函数不可以调用var fn3 = function(){console.log('fn3 executed');return 3;}fn3();//fn3 executed</script>

6.4立即执行函数表达式(function() {})()

function前面一定要加(),因为function是关键字,function如果作为一行的第一个字符,则被认为函数声明结构

    <script>//立即执行函数表达式,是特殊的函数表达式形式,声明后立即调用,特性与函数表达式方式相同//此处只需要证明function不是第一个字符(function(){console.log('fn4 executed');})();</script>

7.函数参数

函数定义时被称为形参,函数调用时参数被称为实参;实参的数量=形参的数量时依次赋值;实参的数量>形参的数量时依次赋值多余的实参被忽略;实参的数量<形参的数量时依次赋值未被赋值的形参为undefined

    <script>//形参默认值function fn(a,b,c,d=500){console.log(a,b,c,d);}fn(1,2,3,4);//输出1,2,3,4//当实参的值为undefined时执行默认值fn(1,2,3,undefined,null);//输出1,2,3,500</script>

8.剩余参数...args在函数定义时,被称为剩余函数

特征:只能有一个剩余函数;必须是最后一个参数; 是数组,可以使用数组的方法

    <script>function add(a,b,...args){console.log(a,b,args);}add(1,2,3,4,5,6,7,8,9,10);</script>

    <script>function add(a,b,...args){console.log(a,b,...args);}add(1,2,3,4,5,6,7,8,9,10);//输出1 2 3 4 5 6 7 8 9 10</script>

 9.延展操作符...变量

可以展开的是可迭代对象(ES6中新增的内容),延展操作符可以展开变量的内容

延展操作符与剩余参数二者格式相同,都是...变量;在函数定义时是剩余参数;在函数调用时,是延展操作符 

    <script>function add(a,b){console.log(a,b);}add(1,2);//输出1,2add([3,4]);//输出[3, 4] undefined//赋值给a变量,b变量没有赋值let arr = [3,4];add(...arr);//输出3,4let str = 'xy';add(...str);//x ylet obj = {name:'zhangsan',age:18}//add(...obj);//报错//默认情况下,对象不能展开let array = ['a','b','c'];console.log(array);//['a', 'b', 'c']console.log(...array);//a b c//可迭代对象中每一个项作为参数传递给函数console.log('a','b','c');//a b c//...array效果相同</script>

相关文章:

66-ES6:var,let,const,函数的声明方式,函数参数,剩余函数,延展操作符

1.JavaScript语言的执行流程 编译阶段&#xff1a;构建执行函数&#xff1b;执行阶段&#xff1a;代码依次执行 2.代码块&#xff1a;{ } 3.变量声明方式var 有声明提升&#xff0c;允许重复声明&#xff0c;声明函数级作用域 访问&#xff1a;声明后访问都是正常的&…...

prime_series_level-1靶场详解

环境搭建 官网https://www.vulnhub.com/entry/prime-1,358/ 直接导入靶机 解题思路 arp-scan -l 确认靶机ip为192.168.236.136 也可以使用nmap扫网段 nmap -sn 192.168.236.0/24 使用nmap扫描靶机开放的端口 nmap -sS -T5 --min-rate 10000 192.168.236.136 -sC -p- &#xf…...

LeetCode刷题笔记之二叉树(三)

一、寻找特定节点 1. 404【左叶子之和】 题目&#xff1a; 给定二叉树的根节点 root &#xff0c;返回所有左叶子之和。代码&#xff1a; class Solution {public int sumOfLeftLeaves(TreeNode root) {//左叶子不止是最左边的叶子&#xff0c;而是二叉树中每个节点的左叶子…...

IBM在闪存系统集成实时恶意软件I/O检测功能

IBM在其最新一代FlashCore Modules&#xff08;FCMs&#xff09;固件中集成了使用机器学习进行实时勒索软件和其他攻击检测的功能。这些FCMs是专用于IBM FlashSystem 5000和Storwize阵列的闪存驱动器&#xff0c;采用U.2外形尺寸及NVMe接口。现有的第三代FCMs分别提供4.8、9.6、…...

bpmn-js中实现xml数据转为json数据

开发bpmn-js建模器,希望将bpmn数据格式转为json数据格式更加清晰的展示数据层次,以结果为导向分析需求,实现功能的思路有两种方式: 通过bpmn-js转化为JS数据对象,然后通过JS中提供的JSON模块转换为json数据将xml解析成dom对象,通过dom对象转化为json格式数据三方库这里主…...

HUAWEI Programming Contest 2024(AtCoder Beginner Contest 342)(A,B,C,D,E,F,G)

看不懂的英文&#xff0c;题意很难理解&#xff0c;这场还是有点难度的。 C需要处理&#xff0c;D是不太明显的dijikstra&#xff0c;E是线段树优化dp&#xff0c;F是个不好想的线段树&#xff0c;主席树应该也能做。 我觉得讲的很好的宝藏up主->B站视频讲解。之后会比较忙…...

解决Docker镜像中CentOS 8仓库问题

前言&#xff1a; 在yum执行过程中&#xff0c;持续遇到与CentOS 8上的’appstream’仓库元数据检索相关的错误。具体错误消息为&#xff1a;“错误&#xff1a;下载’appstream’仓库元数据失败&#xff1a;无法准备内部镜像列表&#xff1a;镜像列表中没有URL。” 问题分析&…...

顶顶通呼叫中心中间件-如何使处于机器人话术中的通话手动转接到坐席分机上讲解(mod_cti基于FreeSWITCH)

顶顶通呼叫中心中间件使用httpapi实现电话转接操作过程讲解(mod_cti基于FreeSWITCH) 需要了解呼叫中心中间件可以点以下链接了解顶顶通小孙 1、使用httpapi接口转接 一、打开web版的ccadmin并且找到接口测试 打开web-ccadmin并且登录&#xff0c;登录完成之后点击运维调试-再…...

HarmonyOS—使用数据模型和连接器

Serverless低代码开发平台是一个可视化的平台&#xff0c; 打通了HarmonyOS云侧与端侧能力&#xff0c;能够轻松实现HMS Core、AGC Serverless能力调用。其中&#xff0c;数据模型和连接器是两大主要元素。开发者在使用DevEco Studio的低代码功能进行开发时&#xff0c;可以使用…...

基于MQTT协议实现微服务架构事件总线

一、场景描述 昨天在博客《客户端订阅服务端事件的实现方法》中提出了利用websocket、服务端EventEmitter和客户端mitt实现客户端订阅服务端事件&#xff0c;大大简化了客户端对服务端数据实时响应的逻辑。上述方案适用于单服务节点的情形。 对于由服务集群支撑的微服务架构&…...

免费的Git图形界面工具sourceTree介绍

阅读本文同时请参阅-----代码库管理工具Git介绍 sourceTree是一款免费的Git图形界面工具&#xff0c;它简化了Git的使用过程&#xff0c;使得开发者可以更加方便地下载代码、更新代码、提交代码和处理冲突。下面我将详细介绍如何使用sourceTree进行这些操作。 1.下载和…...

【Appium UI自动化】pytest运行常见错误解决办法

通过Appium工具录制代码在pycharm上运行报错&#xff1a; 错误一&#xff1a; 1.提示 setup() 方法运行 error failed 解决办法&#xff1a;未创建 init __ 方法&#xff0c;创建一个空的__init.py文件就解决了。 原因&#xff1a; 错误二&#xff1a; 2.运行代码&#xff…...

IDEA如何开启Dashboard

普通的面板 Run Dashboard面板 修改配置文件 找到项目的.idea文件夹 点击编辑workspace.xml文件 添加下方代码 <component name"RunDashboard"><option name"ruleStates"><list><RuleState><option name"name" valu…...

【论文复现】——一种新的鲁棒三维点云平面拟合方法

目录 一、算法原理1、论文概述2、参考文献二、代码实现三、结果展示本文由CSDN点云侠原创,原文链接。如果你不是在点云侠的博客中看到该文章,那么此处便是不要脸的GPT爬虫。 一、算法原理 1、论文概述 针对三维点云中的异常值和粗差点对平面拟合精度产生的影响,文章提出一…...

【C语言】学生宿舍信息管理系统

目录 项目说明 1. 数据结构设计 2. 功能实现 3. 主菜单设计 4. 文件操作 5. 系统使用 项目展示 1.主菜单功能界面 ​编辑 2.添加信息 3.查询信息 4.修改信息 5.删除信息 6.退出程序 项目完整代码 结语 在这篇博客中&#xff0c;我们将探讨如何使用C语言来开发…...

用Python插入页码到PDF文档

页码是许多类型文件中的重要内容&#xff0c;它能方便读者在文档中的导航。在创建PDF文档时&#xff0c;添加页码对于组织和引用内容特别有用。在本文中&#xff0c;我们将探讨如何利用Python程序高效地插入页码到PDF文档中&#xff0c;简化工作流程并创建出精美、结构合理的PD…...

LabVIEW光偏振态转换及检测仿真系统

LabVIEW光偏振态转换及检测仿真系统 随着光学技术的发展&#xff0c;光偏振态的研究与应用越来越广泛。为了深入理解光的偏振现象&#xff0c;开发了一套基于LabVIEW的光偏振态转换及检测仿真系统。该系统不仅能够模拟线偏振光、圆偏振光、椭圆偏振光等不同偏振态的产生与转换…...

scp 本地机和远程机传输文件的方法

在本地机器上&#xff0c;通过ssh连接到远程机器&#xff0c;如果想要在两个机器之间互相传输文件&#xff0c;那么可以使用scp。 scp运行的地方&#xff1a;本地机的终端 样例&#xff1a; 1 将本地文件filename1传输到远程主机的/home/username/filename2目录下 scp -r D:\…...

自定义神经网络二之模型训练推理

文章目录 前言模型概念模型是什么&#xff1f;模型参数有哪些神经网络参数案例 为什么要生成模型模型的大小什么是大模型 模型的训练和推理模型训练训练概念训练过程训练过程中的一些概念 模型推理推理概念推理过程 总结 前言 自定义神经网络一之Tensor和神经网络 通过上一篇…...

Java设计模式:单例模式之六种实现方式详解(二)

在Java中&#xff0c;单例模式是一种常见的设计模式&#xff0c;用于确保一个类只有一个实例&#xff0c;并提供一个全局访问点来获取该实例。单例模式在多种场景下都很有用&#xff0c;比如配置文件的读取、数据库连接池、线程池等。本文将详细介绍Java中实现单例模式的六种方…...

别再只用highlight.js了!Vue3中实现代码高亮的几种方案对比与选型指南

Vue3代码高亮方案深度对比&#xff1a;从Highlight.js到Shiki的进阶指南 在技术文档、博客或开源项目展示中&#xff0c;代码高亮早已成为提升可读性的标配功能。但当我们面对Vue3生态时&#xff0c;选择却远不止于老牌的highlight.js。不同的高亮方案在性能、定制化、语言支持…...

Windows平台ADB与Fastboot驱动自动化部署技术方案详解

Windows平台ADB与Fastboot驱动自动化部署技术方案详解 【免费下载链接】Latest-adb-fastboot-installer-for-windows A Simple Android Driver installer tool for windows (Always installs the latest version) 项目地址: https://gitcode.com/gh_mirrors/la/Latest-adb-fa…...

终极Windows搜索革命:EverythingToolbar自定义过滤器完整指南

终极Windows搜索革命&#xff1a;EverythingToolbar自定义过滤器完整指南 【免费下载链接】EverythingToolbar Everything integration for the Windows taskbar. 项目地址: https://gitcode.com/gh_mirrors/eve/EverythingToolbar 还在为Windows文件搜索效率低下而烦恼…...

手把手教你为STM32G474RET6逆变器项目添加阿里云和蓝牙APP远程监控

STM32G474RET6逆变器项目的智能化升级&#xff1a;云平台与蓝牙监控实战指南 在电力电子领域&#xff0c;逆变器作为能量转换的核心设备&#xff0c;其智能化升级已成为行业趋势。本文将深入探讨如何为基于STM32G474RET6的三相逆变器项目添加远程监控能力&#xff0c;通过4G模块…...

如何高效使用AI图像增强工具:ComfyUI Impact Pack完整操作指南

如何高效使用AI图像增强工具&#xff1a;ComfyUI Impact Pack完整操作指南 【免费下载链接】ComfyUI-Impact-Pack Custom nodes pack for ComfyUI This custom node helps to conveniently enhance images through Detector, Detailer, Upscaler, Pipe, and more. 项目地址: …...

直流微电网在数据中心的应用:如何用5种控制策略提升能源效率

直流微电网在数据中心的应用&#xff1a;如何用5种控制策略提升能源效率 数据中心作为数字经济的核心基础设施&#xff0c;其能耗问题日益突出。据统计&#xff0c;全球数据中心年耗电量已超过2000亿千瓦时&#xff0c;相当于某些中等国家的全年用电量。面对如此巨大的能源需求…...

5个场景让你的Mac音质焕然一新:eqMac音频均衡器完全指南

5个场景让你的Mac音质焕然一新&#xff1a;eqMac音频均衡器完全指南 【免费下载链接】eqMac macOS System-wide Audio Equalizer & Volume Mixer &#x1f3a7; 项目地址: https://gitcode.com/gh_mirrors/eq/eqMac 还在为MacBook音质平平而烦恼&#xff1f;无论是视…...

别再为航拍图发愁了!用Python+PyTorch搞定高分辨率图像切图(附完整代码)

PythonPyTorch高分辨率图像智能切图实战指南 从项目痛点出发&#xff1a;为什么我们需要专业切图方案 去年参与某农业无人机监测项目时&#xff0c;团队首次遭遇了高分辨率图像处理的难题。当我们试图将80006000像素的农田航拍图直接压缩到YOLOv5模型的标准输入尺寸640640时&am…...

抖音内容采集全栈解决方案:从单视频到批量管理的技术实践

抖音内容采集全栈解决方案&#xff1a;从单视频到批量管理的技术实践 【免费下载链接】douyin-downloader A practical Douyin downloader for both single-item and profile batch downloads, with progress display, retries, SQLite deduplication, and browser fallback su…...

华为设备Bootloader解锁神器:PotatoNV让你的旧麒麟手机重获新生

华为设备Bootloader解锁神器&#xff1a;PotatoNV让你的旧麒麟手机重获新生 【免费下载链接】PotatoNV Unlock bootloader of Huawei devices on Kirin 960/95x/65x/620 项目地址: https://gitcode.com/gh_mirrors/po/PotatoNV 还在为华为旧款设备的系统限制而烦恼吗&am…...