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

ES6新特性

  • let、const(es6)和var的区别

        var:var声明变量存在作用域的提升,变量可以在未声明就调用。变量为undefined。

        let: let声明变量是块级作用域,一个{}为一块,不存在作用域提升。只有声明变量后才能使用变量,否则会报错。

        const:const 定义的常量是基本数据类型,不能修改。定义的常量要是引用数据类型,就可以修改。因为保存在栈内存的数据是不可以被修改的。而基本数据类型是直接存储在栈内存中的,所以不能被修改。引用数据类型在栈内存中存储的是一个隐式指针,真正的数据存储在隐式指针指向的堆地址,不可被修改的是指针,真正的数据是可变的。

  • 解构赋值

        数组的解构赋值:相当于剥皮

let res = [0,1,2,'a'];
console.log(...res); // 0 1 2 a

        对象的解构赋值

let res={name: '张杰',chaozuo: function () {console.log('张杰'); // 张杰},dance: function () {console.log('18');  // 18}}
let { chaozuo, dance } = res;
chaozuo();
dance();
  • 模版字符串 反引号(``)

        标签和标签之间可以直接换行,类似于vue中render函数的作用。

        字符串拼接时不用加号,变量直接放在${}中

let name = "张杰";
let age = "18";
let send = `我是${name},我今年${age}` 
console.log(send); // 我是张杰,我今年18
  • 箭头函数

let arr = [1,2,3];
let index = arr.findIndex((item)=>{return item == 1;
})

        当箭头函数没有参数或者有多个参数,要用 () 括起来。

        当箭头函数函数体有多行语句,用 {} 包裹起来,表示代码块,当只有一行语句,并且需要返回结果时,可以省略 {} , 结果会自动返回。

        当箭头函数要返回对象的时候,为了区分于代码块,要用 () 将对象包裹起来。

        箭头函数没有自己的this指向,它指向自己的父级

  • 函数形参默认值

为形参赋默认值,有传实参用实参,没有用默认值

// es6允许给形参赋初始值// 参数直接设置默认值,位置一般靠后function add(a,b,c=2) {console.log(a + b + c);}add(1,2)
// 与解构赋值结合使用 结构赋值的先后不影响function connect({name, age=18, sex}) {console.log(name);console.log(age);console.log(sex);}connect({name:'小宝',sex: 'man'})
  • 简化对象写法

let odj={name,age,
}
  • 扩展运算符

        解构赋值的...就是扩展运算符。

  • Symbol

        Symbol 是 ES6 新引入的一种原始数据类型,表示独一无二的值。它是 js 第七种数据类型 是一种类似于字符串的数据类型。

//创建 Symbol
let h = Symbol()
console.log(a) //Symbol()
console.log(typeof a) //"symbol"
​
//正常的 Symbol
let h1 = Symbol('张杰')
let h2 = Symbol('张杰')
console.log(h1 === h2) // false
​
//相等的Symbol   ----使用 Symbol.for()
let h3 = Symbol.for('小杰')
let h4 = Symbol.for('小杰')
console.log(h1 === h2) // true
  • 集合(set)

  Setes6新增的数据结构,类似于数组,但是成员的值都是唯一的,没有重复的值,我们一般称为集合。项目里面数组去重用到set。

  • 字典(Map)

  Map类型是键值对的有序列表,而键和值都可以是任意类型。

        // 声明Maplet m = new Map()
​// 1.添加元素(键值对)m.set('name','小宝')m.set('age',18)
​// 2.获取元素console.log(m.get(name)) //小宝
​// 3.删除元素m.delete('name')
​// 4.获取元素个数let size = m.sizeconsole.log(size) //1
​// 5.检测是否包含某个元素console.log(m.has('age')); //true// 6.清空Mapm.clear()console.log(m) //0
  • Promise

http://t.csdn.cn/2B9Gp请看Promise详解

  • 类(class)

        ES6 引入了class类这个概念,通过class关键字可以定义类,这就是更符合我们平时所理解的面向对象的语言。

1.简单的类
    //类的声明class Phone {//构造方法 不是必须的,但是constructor名字不能修改constructor(brand, price) {this.brand = brand;this.price = price;}
​//声明成员方法call(someone) {console.log(`我可以给${someone}打电话`);}sendMessage(someone) {console.log(`我可以给${someone}打电话`);}
​//声明静态成员static name = '手机';static change() {console.log('吃了吗');}}
2.类的继承
    //子类继承父类class SmartPhone extends Phone {//子类的构造方法constructor(brand,price,screen,pixel) {//调用父类的构造方法进行初始化  supersuper(brand,price);this.screen = screen;this.pixel = pixel;}//方法声明playGame() {console.log('我可以玩游戏');}
​sw() {console.log('我可以上网');}}
​// 子类实例化const onePlus = new SmartPhone('1+', 3999, 6.5, '4800w');console.log(onePlus);
​console.dir(Phone)console.log(Phone.name);
  • Proxy

         Proxy 对象就是可以让你去对JavaScript中的一切合法对象的基本操作进行自定义.然后用你自定义的操作去覆盖其对象的基本操作,也就是当一个对象去执行一个基本操作时,其执行的过程和结果是你自定义的,而不是对象的。

let p = new Proxy(target, handler);// target 是你要代理的对象.它可以是JavaScript中的任何合法对象.如: (数组, 对象, 函数等等)// handler 是你要自定义操作方法的一个集合.// p 是一个被代理后的新对象,它拥有 target 的一切属性和方法.只不过其行为和结果是在 handler 中自定义的.let obj = {a: 1,b: 2,
}const p = new Proxy(obj, {get(target, key, value) {if (key === 'c') {return '我是自定义的一个结果';} else {return target[key];}},set(target, key, value) {if (value === 4) {target[key] = '我是自定义的一个结果';} else {target[key] = value;}}
})
console.log(obj.a) // 1
console.log(obj.c) // undefined
console.log(p.a) // 1
console.log(p.c) // 我是自定义的一个结果
obj.name = '李白';
console.log(obj.name); // 李白
obj.age = 4;
console.log(obj.age); // 4
p.name = '李白';
console.log(p.name); // 李白
p.age = 4;
console.log(p.age); // 我是自定义的一个结果// 从上面这段代码中,我可以很清楚的看到 Proxy 对象的作用.即是之前所受的 用于定义基本操作的自定
//义行为 .同样的 get 和 set 操作.没有没代理的对象所得的结果是其JavaScript本身的执行机制运行
//计算后所得到的.而被代理了的对象的结果则是我们自定义的.

1.Proxy所能代理的范围--handler

        实际上 handler 本身就是ES6所新设计的一个对象.它的作用就是用来 自定义代理对象的各种可代理操作 。它本身一共有13中方法,每种方法都可以代理一种操作.其13种方法如下:

handler.getPrototypeOf()// 在读取代理对象的原型时触发该操作,比如在执行 Object.getPrototypeOf(proxy) 时。handler.setPrototypeOf()// 在设置代理对象的原型时触发该操作,比如在执行 Object.setPrototypeOf(proxy, null) 时。handler.isExtensible()// 在判断一个代理对象是否是可扩展时触发该操作,比如在执行 Object.isExtensible(proxy) 时。handler.preventExtensions()// 在让一个代理对象不可扩展时触发该操作,比如在执行 Object.preventExtensions(proxy) 时。handler.getOwnPropertyDescriptor()// 在获取代理对象某个属性的属性描述时触发该操作,比如在执行 Object.getOwnPropertyDescriptor(proxy, "foo") 时。handler.defineProperty()// 在定义代理对象某个属性时的属性描述时触发该操作,比如在执行 Object.defineProperty(proxy, "foo", {}) 时。handler.has()// 在判断代理对象是否拥有某个属性时触发该操作,比如在执行 "foo" in proxy 时。handler.get()// 在读取代理对象的某个属性时触发该操作,比如在执行 proxy.foo 时。handler.set()// 在给代理对象的某个属性赋值时触发该操作,比如在执行 proxy.foo = 1 时。handler.deleteProperty()// 在删除代理对象的某个属性时触发该操作,比如在执行 delete proxy.foo 时。handler.ownKeys()// 在获取代理对象的所有属性键时触发该操作,比如在执行 Object.getOwnPropertyNames(proxy) 时。handler.apply()// 在调用一个目标对象为函数的代理对象时触发该操作,比如在执行 proxy() 时。handler.construct()// 在给一个目标对象为构造函数的代理对象构造实例时触发该操作,比如在执行new proxy() 时。

2.proxy的作用

对于代理模式 Proxy 的作用主要体现在三个方面:

1、 拦截和监视外部对对象的访问

2、 降低函数或类的复杂度

3、 在复杂操作前对操作进行校验或对所需资源进行管理

  • Generator函数

        形式上: Generator函数是一个普通的函数,不过相对于普通函数多出了两个特征。一是在function关键字和函数明之间多了’*'号;二是函数内部使用了yield表达式,用于定义Generator函数中的每个状态。
        语法上: Generator函数封装了多个内部状态(通过yield表达式定义内部状态)。执行Generator函数时会返回一个遍历器对象(Iterator(迭代器)对象)。也就是说,Generator是遍历器对象生成函数,函数内部封装了多个状态。通过返回的Iterator对象,可以依次遍历(调用next方法)Generator函数的每个内部状态。
        调用上: 普通函数在调用之后会立即执行,而Generator函数调用之后不会立即执行,而是会返回遍历器对象(Iterator对象)。通过Iterator对象的next方法来遍历内部yield表达式定义的每一个状态。
generator函数执行后得到一个生成器
        Next()方法:每次调用next()方法,内部执行就从函数头部或上一次停下的地方开始执行,直到遇到下一个yield语句为止。

  • 导入导出

        根据功能封装模块 通过import导入 然后通过export导出
        可以使用 export 导出也可以使用export default导出

  • 新增的数组方法

       比如 filter、some、every、reduce等。

相关文章:

ES6新特性

let、const(es6)和var的区别 var:var声明变量存在作用域的提升,变量可以在未声明就调用。变量为undefined。 let: let声明变量是块级作用域,一个{}为一块,不存在作用域提升。只有声明变量后才能使用变量,否则会报错。…...

实现通用的表单清空重置功能

目录 第一版单个表单实现功能并一步步优化公共方法抽离 mixins 混入终版 form1 和 form2 组件实现 第一版单个表单实现功能并一步步优化 通过一步步代码的优化,实现清空重置功能,尽量做到抽离后,可以直接复用,不需要修改任何变量名…...

代码随想录 - Day31 - 回溯:组合问题

代码随想录 - Day31 - 回溯:组合问题 77. 组合 最容易想到的:k层for循环。 显然不能写那么多层for循环,所以该方法pass 使用回溯法: 用递归解决嵌套层数的问题 n相当于树的宽度,k相当于树的深度。 找到最深处的叶子节…...

git文件夹内容详解

.git文件夹是Git版本控制系统在项目根目录下创建的隐藏文件夹,包含了Git仓库的所有相关信息。如下是.git文件夹中常见的一些内容及其作用: HEAD:指向当前所在的分支(或者是一个特定的提交)。 branches:存储…...

MVC模式分层练习

新建库 新建表 插入点数据 先不用MVC模式写功能,来看下缺点是什么 新建一个空项目 选项项目使用的JDK 自己的IDEA总是要重启下 新建模块 因maven还没教 添加框架支持 添加后项目多了这些 添加些必要依赖 这里注意下,如果导入jar包不对可以重新导入下或者是jar包本身出了问…...

ORB-SLAM2算法12之单目初始化Initializer

文章目录 0 引言1 单目初始化Initializer1.1 构造函数1.2 成员函数1.2.1 Initialize1.2.2 FindHomography1.2.3 FindFundamental1.2.4 ReconstructH1.2.5 ReconstructF 2 总结 0 引言 ORB-SLAM2算法7详细了解了System主类和多线程、ORB-SLAM2学习笔记8详细了解了图像特征点提取…...

固定参数-以京东sign逆向为例

前言 在逆向过程中,需要结合frida或unidbg,对整个算法进行一步步的分析,有时候我们分析完某一部分,想要继续往下分析时,需要重新发起请求,这时候的参数往往都已经改变了,这样会打断我们的节奏&a…...

在macOS 上执行sed命令报错问题

错误描述 在macOS 上执行sed命令,报错 sed -i s/book/books/g demo.txt sed: 1: extra characters at the end of d command解决方法 原因是mac的和linux写法不一样 linux sed -i s/book/books/g demo.txtmac sed -i s/book/books/g demo.txt...

ARP欺骗

ARP协议: 地址解析协议,将IP地址转换为对应的mac地址,属链路层协议 ip地址: ip地址本义是为互联网上的每一个网络和每一台主机配置一个唯一的逻辑地址,它的格式表示为:(A.B.C.D)。其…...

pip切换下载源(多种国内源)

pip切换下载源 一、pip二、使用步骤1.查看源2.切换源 一、pip pip 是一个现代的,通用的 Python 包管理工具 二、使用步骤 1.查看源 使用以下命令查看当前pip的下载源 pip config list2.切换源 在国内使用官方下载依赖往往速度慢,易出错&#xff0c…...

ARM Cortex-M 的 SP

文章目录 1、栈2、栈操作3、Cortex-M中的栈4、MDK中的SP操作流程5、Micro-Lib的SP差别1. 使用 Micro-Lib2. 未使用 Micro-Lib 在嵌入式开发中,堆栈是一个很基础,同时也是非常重要的名词,堆栈可分为堆 (Heap) 和栈 (Stack) 。 栈(Stack): 一种…...

【原创】鲲鹏ARM构架openEuler操作系统安装Oracle 19c

作者:einyboy 【原创】鲲鹏ARM构架openEuler操作系统安装Oracle 19c | 云非云计算机科学、自然科学技术科谱http://www.nclound.com/index.php/2023/09/03/%E3%80%90%E5%8E%9F%E5%88%9B%E3%80%91%E9%B2%B2%E9%B9%8Farm%E6%9E%84%E6%9E%B6openeuler%E6%93%8D%E4%BD%9C%E7%B3%BB%…...

k8s之存储篇---数据卷-挂载

挂载是指将定义在 Pod 中的数据卷关联到容器,同一个 Pod 中的同一个数据卷可以被挂载到该 Pod 中的多个容器上。 数据卷内子路径 有时候我们需要在同一个 Pod 的不同容器间共享数据卷。使用 volumeMounts.subPath 属性,可以使容器在挂载数据卷时指向数…...

无涯教程-JavaScript - TDIST函数

The TDIST function replaces the T.DIST.2T & T.DIST.RT functions in Excel 2010. 描述 该函数返回学生t分布的百分点(概率)​​,其中数值(x)是t的计算值,将为其计算百分点。 t分布用于小样本数据集的假设检验。使用此函数代替t分布的临界值表。 语法 TDIST(x,deg_fr…...

IP子网的划分

文章目录 一、子网掩码1. 产生背景2. 定义3. 分类 二、VLSM算法1. 得出下列参数2. 计算划分结果3. 举例子计算 三、常见子网划分对应关系四、练习IP编址题目需求解题1. 192.168.1.100/282. 172.16.0.58/263. 25.83.149.222/254. 100.100.243.18/205. 10.100.100.100/10 首先可以…...

弹性盒子的使用

一、定义 弹性盒子是一种用于按照布局元素的一维布局方法,它可以简便、完整、响应式地实现各种页面布局。 容器中存在两条轴,主轴和交叉轴(相当于我们坐标轴的x轴和y轴)。我们可以通过flex-direction来决定主轴的方向。 主轴(main axis&am…...

软件测试/测试开发丨Selenium 网页frame与多窗口处理

点此获取更多相关资料 本文为霍格沃兹测试开发学社学员学习笔记分享 原文链接:https://ceshiren.com/t/topic/27048 一、多窗口处理. 1.1、多窗口简介 点击某些链接,会重新打开⼀个窗⼜,对于这种情况,想在新页⾯上操作&#xff0…...

MySQL高阶语句(三)

一、NULL值 在 SQL 语句使用过程中,经常会碰到 NULL 这几个字符。通常使用 NULL 来表示缺失 的值,也就是在表中该字段是没有值的。如果在创建表时,限制某些字段不为空,则可以使用 NOT NULL 关键字,不使用则默认可以为空…...

链表OJ练习(2)

一、分割链表 题目介绍: 思路:创建两个链表,ghead尾插大于x的节点,lhead尾插小于x的节点。先遍历链表。最后将ghead尾插到lhead后面,将大小链表链接。 我们需要在创建两个链表指针,指向两个链表的头节点&…...

ssh常用操作

ssh常用操作 SSH是一种安全协议,ssh是该协议的客户端程序,openssh-server则是该协议的服务端程序 常用系统都自带了ssh客户端程序,服务端程序则可能要安装 密码远程登陆 前提:服务器安装了openssh-server,未安装时…...

Keil MDK-ARM高效开发:快捷键与代码完形实战配置

1. Keil配置详解:快捷键与代码完形功能实战指南作为一名嵌入式开发老手,我深知Keil MDK-ARM开发环境的高效配置对工作效率的影响。今天我将分享Configuration配置中Shortcut Keys(快捷键)和Text Completion(代码完形&a…...

2025届必备的五大降重复率神器横评

Ai论文网站排名(开题报告、文献综述、降aigc率、降重综合对比) TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 常见问题是在学术写作以及论文发表进程里,查重率过高。降重网站作为辅助工具&…...

STM32开发基础与高级应用全解析

1. STM32入门基础概念解析对于刚接触STM32的开发者来说,首先需要理解一些基础概念和架构特点。STM32是基于ARM Cortex-M内核的32位微控制器,与传统的51单片机相比,在性能、外设丰富度和开发方式上都有显著差异。1.1 时钟系统架构STM32的时钟树…...

霸王餐外卖接口对接中的签名校验、加密传输 Java 后端实现细节

霸王餐外卖接口对接中的签名校验、加密传输 Java 后端实现细节 在霸王餐(免费试吃)及外卖CPS分销系统的开发中,数据的安全性是核心命脉。由于涉及用户的隐私信息(如手机号、OpenId)以及核心的佣金计算逻辑,…...

政务行业高准确率、可控、符合规范的数据库审计与监测实践方案

一、概要:以高精准风险监测与全链路审计,构筑政务数据安全可控防线在国家数字化治理体系纵深推进的背景下,政务数据已成为驱动政府决策、公共服务与社会管理的关键生产要素。然而,随着政务云、数据共享交换平台的大规模建设&#…...

高并发接口总被打崩?我用 ArrayBlockingQueue + 底层源码深度剖析搞定流控

一、实现原理⚠️注意 ✔️有界阻塞队列:容量固定,必须在初始化时指定长度,无自动扩容机制。 ✔️先进先出(FIFO):入队元素从队尾添加,出队元素从队首取出。 ✔️存取互斥:所有读写操…...

ARM Cortex M0 and M0+ 学习:Architecture

Block Diagram Operation Mode The ARMv6-M architecture has two operation modes and two states. In addition, it can have privileged and unprivileged access levels. Core Registers R0-R12:通用寄存器 R13(SP):存储主栈指针MSP或进程指针PSP,目的是帮助CPU在栈中…...

Windows Defender优化工具:提升系统性能的安全配置方案

Windows Defender优化工具:提升系统性能的安全配置方案 【免费下载链接】windows-defender-remover A tool which is uses to remove Windows Defender in Windows 8.x, Windows 10 (every version) and Windows 11. 项目地址: https://gitcode.com/gh_mirrors/wi…...

基于朴素贝叶斯分类算法的收入预测:Python 数据挖掘项目实战

数据挖掘项目python--基于朴素贝叶斯分类算法的收入预测 项目流程:数据分析训练朴素贝叶斯分类器两个方案实现(pycharmjupyter) 包含内容:数据集代码(pycharmjupyter)文档在数据挖掘领域,预测任…...

架构实战:清洁机器人梯控系统技术路线对比与非侵入式状态机设计

摘要: 商用清洁机器人(如大型洗地机)的跨层调度,是典型的 OT(操作技术)与 IT(信息技术)深度融合场景。在评估不同厂家的机器人梯控系统时,底层架构的安全性与物理容错率是…...