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

那些你面试必须知道的ES6知识点

目录

  • 1、var、let、const的区别
  • 2、作用域考题
  • 3、合并两个对象
  • 4、箭头函数和普通函数的区别
  • 5、Promise有几种状态
  • 6、find和filter的区别
  • 7、some和every的区别

1、var、let、const的区别

区别一:

var有变量提升,而let和const没有

 	<script>console.log(str); //undefinedvar str = "你好";</script>
 	<script>console.log(str); //let str = "你好";</script><script>console.log(str); //const str = "你好";</script>

在这里插入图片描述

区别二:

var可以多次声明一个变量
let和const不能多次声明一个变量

	<script>var str = "你好";var str = '我好'var str = '大家好'console.log(str); //大家好</script>
	<script>let str = "你好";let str = '我好'let str = '大家好'console.log(str); //大家好</script><script>const str = "你好";const str = '我好'const str = '大家好'console.log(str); //大家好</script>

在这里插入图片描述

区别三:

var、let声明变量、
const声明常量
var和let声明的变量可以再次赋值,但是const不可以再次赋值了。

	<script>var str1 = "你好";let str2 = "我好";const str3 = "大家好";str1 = "哈哈";str2 = "哈哈哈";str3 = "哈哈哈哈";console.log(str1); //哈哈console.log(str2); //哈哈哈console.log(str3); //报错,/*  */Uncaught TypeError: Assignment to constant variable.</script>

区别四:

var声明的变量没有块级作用域
let和const声明的变量有自身块级作用域

	 <script>if (true) {var str = "哈哈哈";}console.log(str);//哈哈哈</script>
	 <script>if (true) {let str = "哈哈哈";}console.log(str);// ReferenceError: str is not defined</script>
	 <script>if (true) {const str = "哈哈哈";}console.log(str);// ReferenceError: str is not defined</script>

2、作用域考题

考题一:let和const没有变量提升性

 	<script>console.log(str); //undefinedvar str = "你好";console.log(num); //报错let num = 10;</script>

考题二:

 <script>function demo() {var n = 2;if (true) {var n = 1;}console.log(n); //1}demo();</script>
<script>function demo() {let n = 2;if (true) {let n = 1;}console.log(n); //2}demo();
</script>

考题三:可以修改引用对象里面的值,不能直接修改本身

 <script>const obj = {a: 1,};obj.a = 11111;console.log(obj);const arr = ["a", "b", "c"];arr[0] = "aaaaa";console.log(arr);</script>

在这里插入图片描述

 <script>const obj = {a: 1,};obj = {a: 2,};console.log(obj);const arr = ["a", "b", "c"];arr = ["hh"];console.log(arr);</script>

在这里插入图片描述
直接报错。

3、合并两个对象

方式一:Object.assign

 <script>let a = {a: 1,b: 2,};let b = {a: 4,b: 5,c: 6,};const obj1 = Object.assign(a,b);console.log(obj1);</script>

如果有相同的属性值,后者覆盖前者。

方式二:…扩展运算符

<script>let a = {a: 1,b: 2,};let b = {a: 4,b: 5,c: 6,};const obj1 = {...a,...b};console.log(obj1);</script>

方式三:自己封装方法

	<script>let a = {a: 1,b: 2,};let b = {a: 4,b: 5,c: 6,};function merge(target, source) {for(let key in source) {target[key] = source[key];}return target;}console.log(merge(a, b));</script>

4、箭头函数和普通函数的区别

1、this指向问题

箭头函数的this指向在定义的时候就决定了,不能通过(call、apply、bind)改变
箭头函数的this指向定义的时候,指向外层第一个普通函数,如果为最顶层则指向window。

 <script>let obj = {a: function () {console.log(this);},b:()=>{console.log(this);}};obj.a();obj.b();</script>

在这里插入图片描述
使用call改变this指向,无效果.
apply和bind同样。

 <script>let obj = {a: function () {console.log(this);},b:()=>{console.log(this);}};obj.a();obj.b.call(obj);</script>

在这里插入图片描述
2、箭头函数不能new(不能实例化成构造函数)

<script>let obj = {a: function () {console.log(this);},b:()=>{console.log(this);}};let objA = new obj.a();let objB = new obj.b();</script>

在这里插入图片描述
3、箭头函数没有prototype(原型)

<script>let obj = {a: function () {console.log(this);},b:()=>{console.log(this);}};console.log(obj.a.prototype)console.log(obj.b.prototype)
</script>

在这里插入图片描述
4、箭头函数没有arguments

	<script>let ff = function () {console.log(arguments);};let fn = () => {console.log(arguments);};ff();fn();</script>

在这里插入图片描述

 <script>let ff = function () {return fn = () => {console.log(arguments);};};ff()();</script>

如果箭头函数的外层第一个普通函数有arguments,则改箭头函数的arguments为父级作用域的arguments。

我们可以通过Rest(剩余)运算符解决箭头函数没有arguments的问题。

<script>let ff = function() {console.log(arguments);} let fn = (...res) => {console.log(res);};ff(1)fn(1)</script>

在这里插入图片描述

5、Promise有几种状态

  1. 使用promise的时候,给它一个承诺,我们可以将他划分为三个阶段
  • pending(待定),执行了executor,状态还在等待中,没有被兑现,也没有被拒绝
  • fulfilled(已兑现),执行了resolve函数则代表了已兑现状态
  • rejected(已拒绝),执行了reject函数则代表了已拒绝状态
  1. 简单理解:
  • 你承诺自己明天开始好好学习(还未到明天,此时为待定状态
  • 时光飞逝,到了第二天你去图书馆好好学习了(已兑现状态
  • 时光飞逝,到了第二天你因为某些事情而无法去图书馆学习(已拒绝状态
  1. 状态只要从待定状态,变为其他状态后,则状态不能再改变。
  • 比如从pengding状态变为fulfilled状态后,则不能在从fulfilled状态变为rejected状态
  • 同样从pengding状态变为rejected状态后,则不能在从rejected状态变为fulfilled状态

举个栗子:

	const p = new Promise((resolve,reject)=>{setTimeout(()=>{resolve('成功了')reject('失败了')},1000)})p.then(resolve=>console.log(resolve)).catch(reject=>console.log(reject))//成功了

当我调用resolve之后,在调用reject是无效的,因为状态已经发生改变,并且是不可逆的。

6、find和filter的区别

区别一:返回的内容不同

filter 返回是新数组
find 返回具体的内容

区别二:

find :匹配到第一个即返回
filter : 返回整体(每一个匹配到的都返回)

	<script>let arr = [1, 2, 3, 4, 5];let newArr1 = arr.find((item) => {return item > 2;});let newArr2 = arr.filter((item) => {return item > 2;});console.log(newArr1);console.log(newArr2);console.log(arr);//都不改变原数组</script>

在这里插入图片描述

7、some和every的区别

some ==》 如果有一项匹配则返回true
every ==》 全部匹配才会返回true

<script>let arr = [1, 2, 3, 4, 5];let newArr1 = arr.some((item) => {return item > 2;});let newArr2 = arr.every((item) => {return item > 2;});console.log(newArr1);console.log(newArr2);</script>

在这里插入图片描述

 <script>let arr = [1, 2, 3, 4, 5];let newArr1 = arr.some((item) => {return item > 0;});let newArr2 = arr.every((item) => {return item > 0;});console.log(newArr1);console.log(newArr2);</script>

在这里插入图片描述

相关文章:

那些你面试必须知道的ES6知识点

目录 1、var、let、const的区别2、作用域考题3、合并两个对象4、箭头函数和普通函数的区别5、Promise有几种状态6、find和filter的区别7、some和every的区别 1、var、let、const的区别 区别一&#xff1a; var有变量提升&#xff0c;而let和const没有 <script>console.l…...

AD9371 系列快速入口

参考资料&#xff1a; AD9371 JESD204 Interface Framework Generic JESD204B block designs AD9371 & AD9375 Prototyping Platform User Guide ADI™ Reference Designs HDL User Guide 相关设备 &#xff1a; ZCU106ADRV9371CPRO33-30.726 dB 衰减 AD9371ZCU102 移植到…...

Jenkins+vue发布项目

在Jenkins 中先创建一个任务名称 然后进行下一步&#xff0c;放一个项目 填写一些参数 参数1&#xff1a; 参数2&#xff1a; 参数3&#xff1a;参数4&#xff1a; 点击保存就行了 配置脚本 // git def git_url http://gitlab.xxxx.git def git_auth_id GITEE_RIVER…...

RSTP详解:对比STP,到底改进了什么?

一、RSTP概述 IEEE 802.1W中定义的RSTP可以视为STP的改进版本&#xff0c;RSTP在许多方面对STP进行了优化&#xff0c;它的收敛速度更快&#xff0c;而且能够兼容STP。 二、RSTP对STP的改进 改进点1&#xff1a;端口角色 、 改进点2&#xff1a;端口状态 RSTP的状态规范缩…...

从0到1,申请cos服务器并上传图片到cos文件服务器

目录 准备工作 Java代码编写 控制台打印 整理成工具类 编写接口 Postman测试 准备工作 1.进入网址腾讯云 产业智变云启未来 - 腾讯 (tencent.com) 2.搜索cos,点击立即使用&#xff0c;刚开始会免费赠送你 3.存储都是基于桶的&#xff0c;先创建桶&#xff0c;在桶里面创…...

Stm32_标准库_15_串口蓝牙模块_手机与蓝牙模块通信_BUG修复

代码&#xff1a; #include "stm32f10x.h" // Device header #include "Delay.h" #include "OLED.h" #include "Serial.h" #include "Time.h" #include "Function.h" #include <stdio.h> #include <…...

文心一言帮忙写代码之微信小程序图片移动顺序

先上效果图&#xff0c;图片顺序可移动&#xff0c;左移右移调准顺序。 代码是文心一言帮忙写的&#xff0c;自己稍微改造就可以用了。 首先是往左移&#xff0c;也就是从下标1移到下标0 &#xff0c;下标2移到下标1 var imglist [‘aa’, ‘bb’, ‘cc’, ‘dd’]; function…...

【电子通识】USB接口三大类型图册

基本概念 不同时期的USB接口有不同的类型&#xff0c;USB接口分为插头和插座&#xff1a; 插头&#xff0c;plug&#xff0c;对应的也叫公口&#xff0c;即插别人的。 插座&#xff0c;receptacle&#xff0c;对应也叫做母口&#xff0c;即被插的。 USB的接口类型&#xff0…...

@Controller与@RestController

总结 Controller &#xff1a;定义一个控制器类. RequestMapping &#xff1a;给出外界访问方法的路径&#xff0c;或者说触发路径 &#xff0c;触发条件。 具体解析访问路径到某个方法上. ResponseBody &#xff1a;标记Controller类中的方法。把return的结果变成JSON对象…...

Compose Desktop 使用中的几个问题(分平台加载资源、编写Gradle 任务下载平台资源、桌面特有组件、鼠标键盘事件)

前言 在我之前的文章 Compose For Desktop 实践&#xff1a;使用 Compose-jb 做一个时间水印助手 中&#xff0c;我们使用 Compose For Desktop 写了一个用于读取照片 EXIF 中的拍摄日期参数并以文字水印的方式添加到照片上的桌面程序。 但是事实上&#xff0c;这个程序的名字…...

【华为OD机试python】返回矩阵中非1的元素个数【2023 B卷|200分】

【华为OD机试】-真题 !!点这里!! 【华为OD机试】真题考点分类 !!点这里 !! 题目描述 存在一个m*n的二维数组,其成员取值范围为0,1,2。 其中值为1的元素具备同化特性,每经过1S,将上下左右值为0的元素同化为1。 而值为2的元素,免疫同化。 将数组所有成员随机初始化为0或…...

容器安全 - 利用容器的特权配置实现对Kubernetes容器的攻击

《OpenShift / RHEL / DevSecOps 汇总目录》 文章目录 准备环境利用特权配置对Kubernetes容器攻击privileged hostpathprivileged hostpidprivilegedhostpathhostpidhostipchostnetwork 参考 通过将运行 Pod 的 privileged 设为 true&#xff0c;容器就以特权模式运行在宿主…...

深度剖析Android Binder IPC机制

Android系统的成功离不开其强大的IPC&#xff08;Inter-Process Communication&#xff09;机制&#xff0c;其中最引人注目的就是Binder。本文将深入探讨Binder的技术原理&#xff0c;解释其工作方式以及相关的关键概念。 什么是Binder Binder是Android系统中的IPC机制&…...

【底层服务/编程功底系列】「大数据算法体系」带你深入分析MapReduce算法 — Shuffle的执行过程

【底层服务/编程功底系列】「大数据算法体系」带你深入分析MapReduce算法 — Shuffle的执行过程 Shuffle是什么Shuffle的流程处理map任务的执行流程reduce任务的执行流程 Shuffle过程分析和优化map任务深入分析细化步骤分析1. 数据分片读取2. 分配计算Reduce服务Partitioner分区…...

CISA 彻底改变了恶意软件信息共享:网络安全的突破

在现代网络安全中&#xff0c;战术技术和程序&#xff08;TTP&#xff09;的共享对于防范网络事件至关重要。 因此&#xff0c;了解攻击向量和攻击类型之间的关联如今是让其他公司从其他公司遭受的 IT 事件中受益&#xff08;吸取经验教训&#xff09;的重要一步。 美国主要网…...

macos 12 支持机型 macOS Monterey 更新中新增的功能

macOS Monterey 能让你以全然一新的方式与他人沟通联络、共享内容和挥洒创意。尽享 FaceTime 通话新增的音频和视频增强功能&#xff0c;包括空间音频和人像模式。通过功能强大的效率类工具&#xff08;例如专注模式、快速备忘录和 Safari 浏览器中的标签页组&#xff09;完成更…...

代码随想录算法训练营第五十六天|1143.最长公共子序列、1035.不相交的线、53. 最大子序和

代码随想录算法训练营第五十六天|1143.最长公共子序列、1035.不相交的线、53. 最大子序和 1143.最长公共子序列1035.不相交的线53. 最大子序和 做了一个小时左右 1143.最长公共子序列 题目链接&#xff1a;1143.最长公共子序列 文章链接 状态&#xff1a;会做 代码 class Solu…...

01认识微服务

一、微服务架构演变 1.单体架构 将所有的功能集中在一个项目开发&#xff0c;打成一个包部署。优点架构简单&#xff0c;部署成本低。缺点耦合度高&#xff0c;不利于大型项目的开发和维护 2.分布式架构 根据业务功能对系统进行拆分&#xff0c;每个业务模块作为独立的项目…...

智能电表上的模块发热正常吗?

智能电表是一种可以远程抄表、计费、控制和管理的电力计量设备&#xff0c;它可以实现智能化、信息化和网络化的电力用电管理。智能电表的主要组成部分包括电能计量模块、通信模块、控制模块和显示模块等。其中&#xff0c;通信模块和控制模块是智能电表的核心部件&#xff0c;…...

网络代理技术的广泛应用和安全保障

随着网络世界的日益发展&#xff0c;网络代理技术作为保障隐私和增强安全的重要工具&#xff0c;其在网络安全、爬虫开发和HTTP协议中的多面应用备受关注。下面我们来深入了解Socks5代理、IP代理以及它们的作用&#xff0c;探讨它们如何促进网络安全和数据获取。 Socks5代理和…...

深入浅出:JavaScript 中的 `window.crypto.getRandomValues()` 方法

深入浅出&#xff1a;JavaScript 中的 window.crypto.getRandomValues() 方法 在现代 Web 开发中&#xff0c;随机数的生成看似简单&#xff0c;却隐藏着许多玄机。无论是生成密码、加密密钥&#xff0c;还是创建安全令牌&#xff0c;随机数的质量直接关系到系统的安全性。Jav…...

k8s业务程序联调工具-KtConnect

概述 原理 工具作用是建立了一个从本地到集群的单向VPN&#xff0c;根据VPN原理&#xff0c;打通两个内网必然需要借助一个公共中继节点&#xff0c;ktconnect工具巧妙的利用k8s原生的portforward能力&#xff0c;简化了建立连接的过程&#xff0c;apiserver间接起到了中继节…...

大学生职业发展与就业创业指导教学评价

这里是引用 作为软工2203/2204班的学生&#xff0c;我们非常感谢您在《大学生职业发展与就业创业指导》课程中的悉心教导。这门课程对我们即将面临实习和就业的工科学生来说至关重要&#xff0c;而您认真负责的教学态度&#xff0c;让课程的每一部分都充满了实用价值。 尤其让我…...

快刀集(1): 一刀斩断视频片头广告

一刀流&#xff1a;用一个简单脚本&#xff0c;秒杀视频片头广告&#xff0c;还你清爽观影体验。 1. 引子 作为一个爱生活、爱学习、爱收藏高清资源的老码农&#xff0c;平时写代码之余看看电影、补补片&#xff0c;是再正常不过的事。 电影嘛&#xff0c;要沉浸&#xff0c;…...

python爬虫——气象数据爬取

一、导入库与全局配置 python 运行 import json import datetime import time import requests from sqlalchemy import create_engine import csv import pandas as pd作用&#xff1a; 引入数据解析、网络请求、时间处理、数据库操作等所需库。requests&#xff1a;发送 …...

pycharm 设置环境出错

pycharm 设置环境出错 pycharm 新建项目&#xff0c;设置虚拟环境&#xff0c;出错 pycharm 出错 Cannot open Local Failed to start [powershell.exe, -NoExit, -ExecutionPolicy, Bypass, -File, C:\Program Files\JetBrains\PyCharm 2024.1.3\plugins\terminal\shell-int…...

鸿蒙(HarmonyOS5)实现跳一跳小游戏

下面我将介绍如何使用鸿蒙的ArkUI框架&#xff0c;实现一个简单的跳一跳小游戏。 1. 项目结构 src/main/ets/ ├── MainAbility │ ├── pages │ │ ├── Index.ets // 主页面 │ │ └── GamePage.ets // 游戏页面 │ └── model │ …...

【安全篇】金刚不坏之身:整合 Spring Security + JWT 实现无状态认证与授权

摘要 本文是《Spring Boot 实战派》系列的第四篇。我们将直面所有 Web 应用都无法回避的核心问题&#xff1a;安全。文章将详细阐述认证&#xff08;Authentication) 与授权&#xff08;Authorization的核心概念&#xff0c;对比传统 Session-Cookie 与现代 JWT&#xff08;JS…...

实战设计模式之模板方法模式

概述 模板方法模式定义了一个操作中的算法骨架&#xff0c;并将某些步骤延迟到子类中实现。模板方法使得子类可以在不改变算法结构的前提下&#xff0c;重新定义算法中的某些步骤。简单来说&#xff0c;就是在一个方法中定义了要执行的步骤顺序或算法框架&#xff0c;但允许子类…...

向量几何的二元性:叉乘模长与内积投影的深层联系

在数学与物理的空间世界中&#xff0c;向量运算构成了理解几何结构的基石。叉乘&#xff08;外积&#xff09;与点积&#xff08;内积&#xff09;作为向量代数的两大支柱&#xff0c;表面上呈现出截然不同的几何意义与代数形式&#xff0c;却在深层次上揭示了向量间相互作用的…...