js面试---ES6

1、let、const、var的区别

        块级作用域:let和const具有块级作用域,var不存在块级作用域。块级作用域解决了内层变量可能覆盖外层变量,以及用来计数的循环变量泄露为全局变量的问题。

        变量提升:var存在变量提升,let和const不存在变量提升(只能在声明后使用,否则会报错)

        给全局添加属性:浏览器的全局对象是window,Node的全局对象是global。var声明的变量为全局变量,并且会将该变量添加为全局对象的属性,但let和const不会。

        重复声明:var可以重复声明变量,let和const不可以。

        暂时性死区:在使用let、const命令声明变量之前,该变量都是不可用的。这在语法上,称为暂时性死区。var声明变量,不存在暂时性死区。

        初始值设置:var和let在声明变量时可以不用设置初始值,const在声明变量时必须设置初始值。

        指针指向:let和const都是ES6新增语法,let创建的变量是可以更改指针指向的,而const声明的变量是不允许改变指针指向的。

2、const对象的属性可以修改吗

        const保证的不是变量的值不能改变,而是变量指向的那个内存地址不能改动。对于基本数据类型的数据,其值就保存在变量指向的那个内存地址,因此等同于常量。

        但对于引用类型的数据,变量指向数据的内存地址,保存的是一个指针,const只能保证这个指针是固定不变的,至于它指向的数据结构是不是不可变的,就完全不能控制了。

3、可以new一个箭头函数吗

        箭头函数没有自己的prototype,也没有自己的this指向,不能使用arguments参数,所以不能new一个箭头函数。

        new操作符的实现步骤:

                a、创建一个对象

                b、将构造函数的作用域赋给新对象(即将对象的__proto__属性指向构造函数的prototype属性)

                c、指向构造函数中的内容,构造函数中的this指向该对象(即为这个对象添加属性的方法)

                d、返回新对象

        箭头函数无法执行第2、3步。

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

        a、箭头函数比普通函数更简洁:如果不需要参数,一个空括号即可;如果只有一个参数,可以省略括号;如果有多个参数,用逗号分隔;如果函数体的返回值只有一句话,可以省略大括号;如果函数体不需要返回值,且只有一句话,在关键句前加一个void关键字即可。

let fn = () => void doesNotReturn();

        b、箭头函数没有自己的this:箭头函数在自己作用域的上一层继承this,所以箭头函数中this的指向在它定义时已经确定了,后续不会改变。

        c、 call()、apply()、bind()等方法不能改变箭头函数的this的指向

        d、箭头函数不能作为构造函数使用

        e、箭头函数没有自己的arguments

        f、箭头函数没有prototype

        g、箭头函数不能用作Generator函数,不能用yield关键字

5、扩展运算符的作用及使用场景

        a、对象扩展运算符:用于取出参数对象中的所有可遍历属性,拷贝到当前对象中

        扩展运算符对对象实例的拷贝属于浅拷贝。

let bar = { a: 1, b: 2 };
let baz = { ...bar }; // { a: 1, b: 2 }

        如果用户自定义的属性,放在 扩展运算符后面,则后面的属性会覆盖前面的属性。

let bar = {a: 1, b: 2};
let baz = {...bar, ...{a:2, b: 4}};  // {a: 2, b: 4}

        b、数组扩展运算符

        可以将数组转为用逗号分隔的参数序列,且每次只能展开一层数组。

console.log(...[1, 2, 3])
// 1 2 3
console.log(...[1, [2, 3, 4], 5])
// 1 [2, 3, 4] 5

        将数组转换为参数序列:

function add(x, y) {return x + y;
}
const numbers = [1, 2];
add(...numbers) // 3

        复制数组:

const arr1 = [1, 2];
const arr2 = [...arr1];  // [1, 2]

        合并数组:

const arr1 = ['two', 'three'];
const arr2 = ['one', ...arr1, 'four', 'five'];  // ["one", "two", "three", "four", "five"]

        与结构复制结合起来生成数组:

const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest  // [2, 3, 4, 5]

        如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错。 

        将字符串转换为数组:

[...'hello']    // [ "h", "e", "l", "l", "o" ]

        使用Math函数获取数组中的特定值:

const numbers = [9, 4, 7, 1];
Math.min(...numbers); // 1
Math.max(...numbers); // 9

6、 Proxy可以实现什么功能

        在vue3中,使用Proxy替换Object.defineProperty来实现数据响应式。

        Proxy是ES6新增功能,可以用来自定义对象中的操作。

let p = new Proxy(target, handler)

        target代表要添加代理的对象,handler用来自定义对象中的操作。

        以下是一个简单的例子: 

let onWatch = (obj, setBind, getLogger) => {let handler = {get(target, property, receiver) {getLogger(target, property)return Reflect.get(target, property, receiver)},set(target, property, value, receiver) {setBind(value, property)return Reflect.set(target, property, value)}}return new Proxy(obj, handler)
}
let obj = { a: 1 }
let p = onWatch(obj,(v, property) => {console.log(`监听到属性${property}改变为${v}`)},(target, property) => {console.log(`'${property}' = ${target[property]}`)}
)
p.a = 2 // 监听到属性a改变
p.a // 'a' = 2

 7、如何提取高度嵌套的对象里的指定属性

const school = {classes: {stu: {name: 'Bob',age: 24,}}
}

        方法一:逐层解构

const { classes } = school
const { stu } = classes
const { name } = stu
name // 'Bob'

        方法二:嵌套解构

const { classes: { stu: { name } }} = schoolconsole.log(name)  // 'Bob'

        在解构出来的变量名右侧,通过冒号+{目标属性名}这种形式,进一步解构它,一直解构到拿到目标数据为止。

8、对...参数的理解

        扩展运算符被用在函数形参上时,可以把一个分离的参数序列整合成一个数组:

function mutiple(...args) {let result = 1;for (var val of args) {result *= val;}return result;
}
mutiple(1, 2, 3, 4) // 24

        传入 mutiple 的是四个分离的参数,但是如果在 mutiple 函数里尝试输出 args 的值,会发现它是一个数组。 

function mutiple(...args) {console.log(args)
}
mutiple(1, 2, 3, 4) // [1, 2, 3, 4]

        除解构等外,还可以把函数的多个入参收敛进一个数组里。这一点经常用于获取函数的多余参数,或者像上面这样处理函数参数个数不确定的情况。

9、ES6中模板语法

         模板语法使字符串的拼接变得更加简单:

var name = 'css'   
var career = 'coder' 
var hobby = ['coding', 'writing']
var finalString = `my name is ${name}, I work as a ${career} I love ${hobby[0]} and ${hobby[1]}`

        模板字符串允许用${}的方式嵌入变量,使字符串的拼接更加简单、易读。模板字符串中,空格、缩进、换行都会被保留;且还可以在${}在进行一些简单的计算。

function add(a, b) {const finalString = `${a} + ${b} = ${a+b}`console.log(finalString)
}
add(1, 2) // 输出 '1 + 2 = 3'

10、ES6中的字符串处理方法

        存在性判定:includes、startsWith、endsWith

        includes:判断字符串与子串的包含关系

const son = 'haha' 
const father = 'xixi haha hehe'
father.includes(son) // true

         startsWith:判断字符串是否以某个字符开头

const father = 'xixi haha hehe'
father.startsWith('haha') // false
father.startsWith('xixi') // true

         endsWith:判断字符串是否以某个字符结尾

const father = 'xixi haha hehe'
father.endsWith('hehe') // true

        自动重复:可以使用repeat方法来使同一个字符串输出多次(被连续复制多次)

const sourceCode = 'repeat for 3 times;'
const repeated = sourceCode.repeat(3) 
console.log(repeated) // repeat for 3 times;repeat for 3 times;repeat for 3 times;

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

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

相关文章

网络篇09 | 运输层 udp

网络篇09 | 运输层 udp 01 简介UDP 是面向报文的 02 报文协议 01 简介 UDP 只在 IP 的数据报服务之上增加了一些功能:复用和分用、差错检测 UDP 的主要特点:无连接。发送数据之前不需要建立连接。 使用尽最大努力交付。即不保证可靠交付。 面向报文。…

DRF视图组件(2个视图基类、5个视图扩展类、9个视图子类、视图集和路由映射)

DRF视图组件(2个视图基类、5个视图扩展类、9个视图子类、视图集和路由映射) 目录 DRF视图组件(2个视图基类、5个视图扩展类、9个视图子类、视图集和路由映射)2个视图基类mixins的5个视图扩展类generics的9个视图子类视图集自定制返回格式自动生成路由(SimpleRouter)action装饰器…

【Java】Object类

目录 一、equals 方法 二、hashCode 方法 三、toString 方法 四、finalize 方法 一、equals 方法 只能判断引用类型默认判断的是地址是否相等,也就是判断两个对象是不是同一个对象子类中往往重写该方法,用于判断内容是否相等 public class Equals…

[lesson30]操作符重载的概念

操作符重载的概念 操作符重载 C中的重载能够扩展操作符的功能 操作符的重载以函数的方式进行 本质: 用特殊形式的函数扩展操作符的功能 通过operator关键字可以定义特殊的函数 operator的本质是通过函数重载操作符 语法: 可以将操作符重载函数定…

Android RecyclerView性能优化及Glide流畅加载图片丢帧率低的一种8宫格实现,Kotlin

Android RecyclerView性能优化及Glide流畅加载图片丢帧率低的一种8宫格实现&#xff0c;Kotlin <uses-permission android:name"android.permission.READ_EXTERNAL_STORAGE" /><uses-permission android:name"android.permission.READ_MEDIA_IMAGES&qu…

c# 服务创建

服务 创建服务 编写服务 可以对server1.cs重新命名&#xff0c;点击你的server按F7进入代码编辑模式&#xff0c;编写脚本 双击你的server.cs右击空白位置&#xff0c;添加安装程序&#xff0c;此时会生成“serviceInstaller1”及“serviceProcessInstaller1” 后续可以点击P…

faker 伪造数据生成库

faker 伪造数据生成库 前言 javafaker&#xff0c;这是一个用于生成假数据的 Java 库&#xff0c;与 Python 的 faker 库类似。javafaker 库提供了很多方法&#xff0c;用于生成各种类型的随机数据&#xff0c; 基本用法 api介绍 <!--java faker用于生成随机数据-->&…

使用AI动作捕捉制作动画图像——Viggle AI教程

使用AI动作捕捉制作动画图像——Viggle AI教程 在数字媒体时代&#xff0c;动画制作已经成为一种流行的艺术形式。最近&#xff0c;我在网上发现了一个非常有趣的AI动画制作工具——Viggle AI。这个工具不仅简单易用&#xff0c;而且目前还是免费的。在这篇博客中&#xff0c;我…

护眼台灯哪个牌子最好,护眼台灯品牌排行榜分享

​护眼台灯哪个牌子最好&#xff1f;尽管一些家长可能对护眼台灯还不甚了解&#xff0c;下面我将介绍这类台灯的几个显著优势&#xff1a;它们专为减少眼睛疲劳和保护视力而设计&#xff0c;提供稳定且柔和的光线&#xff1b;具备灵活的亮度调节功能&#xff0c;适应不同的阅读…

springMVC理解

springMVC是一种思想&#xff0c;将软件划分为&#xff0c;模型Model&#xff0c;视图View&#xff0c;控制器Controller。 MVC的工作原理&#xff1a;用户通过前端视图页面&#xff0c;发送请求到服务器&#xff0c;在服务器中请求被Controller接收&#xff0c;Controller调用…

使用PL\SQL将Excel表格导入到oracle数据库中

因为要测试生产问题&#xff0c;需要把生产上oracle导出数据导入到测试环境oracle数据库中&#xff0c;尝试了N种方法&#xff0c;发现使用PL\SQL 的ODBC 方法比较好用 1、开始 首先使用plsqldev里面的&#xff0c;工具--》下面的odbc导入器 2、配置 点击之后&#xff0c;会…

OpenHarmony轻量系统开发【2】源码下载和开发环境

2.1源码下载 关于源码下载的&#xff0c;读者可以直接查看官网&#xff1a; https://gitee.com/openharmony/docs/tree/master/zh-cn/release-notes 本文这里做下总结&#xff1a; &#xff08;1&#xff09;注册码云gitee账号。 &#xff08;2&#xff09;注册码云SSH公钥…

weblogic oracle数据源配置

在weblogic console中配置jdbc oracle数据源 1. base_domain->Service->DataSources 在Summary of JDBC Data Sources中&#xff0c;点击New, 选择【Generic Data Source】通用数据源。 2. 设置数据源Name和JNDI name 注&#xff1a;设置的JNDI Name是Java AP中连接…

用于 SQLite 的异步 I/O 模块(二十四)

返回&#xff1a;SQLite—系列文章目录 上一篇&#xff1a;SQLite的PRAGMA 声明&#xff08;二十三&#xff09; 下一篇&#xff1a;SQLite、MySQL 和 PostgreSQL 数据库速度比较&#xff08;本文阐述时间很早比较&#xff0c;不具有最新参考性&#xff09;&#xff08;二…

C#医学实验室/检验信息管理系统(LIS系统)源码

目录 检验系统的总体目标 LIS主要包括以下功能&#xff1a; LIS是集&#xff1a;申请、采样、核收、计费、检验、审核、发布、质控、耗材控制等检验科工作为一体的信息管理系统。LIS系统不仅是自动接收检验数据&#xff0c;打印检验报告&#xff0c;系统保存检验信息的工具&a…

使用Hugo、Github Pages搭建自己的博客

文章目录 搭建博客框架及对比使用Hugo搭建博客使用Github Pages部署博客 搭建博客框架及对比 在众多的博客框架中&#xff0c;Hugo、Jekyll和Hexo因其出色的性能和易用性而备受推崇。 特点HugoJekyllHexo速度极高中等较高易用性高中等高&#xff08;熟悉JavaScript者&#xf…

算法题解记录12+++划分字母区间(百日筑基)

本题我首先分享我的思路&#xff0c;再在补充中说明贪心算法。 题目描述&#xff1a; 给你一个字符串 s 。我们要把这个字符串划分为尽可能多的片段&#xff0c;同一字母最多出现在一个片段中。 注意&#xff0c;划分结果需要满足&#xff1a;将所有划分结果按顺序连接&#x…

书生·浦语大模型全链路开源体系-第5课

书生浦语大模型全链路开源体系-第5课 书生浦语大模型全链路开源体系-第5课相关资源LMDeploy基础配置LMDeploy运行环境下载internlm2-chat-1_8b模型使用Transformer来直接运行InternLM2-Chat-1.8B模型使用LMDeploy以命令行方式与InternLM2-Chat-1.8B模型对话设置KV Cache最大占用…

域名结构的组成

在我们日常的网络使用中&#xff0c;经常会接触到各种各样的域名。域名作为互联网上的标识符号&#xff0c;起到了连接用户和网站的桥梁作用。那么&#xff0c;域名的结构是怎样的呢&#xff1f;它由哪些组成部分构成&#xff1f; 一个完整的域名通常由多个部分组成&#xff0…

数据结构--栈,队列,串,广义表

3.栈 &#xff08;先进后出&#xff09; 栈是一种特殊的线性表&#xff0c;只能从一端插入或删除操作。 4.队列 4.1 4.1.1初始化 4.1.2判断队列是否为空 4.1.3判断队列是否为满 4.1.4入队 4.1.5出队 4.1.6打印队列 4.1.7销毁队列 5.串 5.1 串的定义 由零个或者任意多…