网站首页
手机版

前端ES6高频面试题(前端面试题2024)

更新时间:2024-06-10 21:08作者:小乐

ES6 你能解释一下ES5和ES6之间的区别吗? ECMAScript 5 (ES5):ECMAScript 的第五个版本,于2009 年标准化,所有现代浏览器都完全支持该标准。

ECMAScript 6 (ES6)/ECMAScript 2015 (ES2015): ECMAscript 版本6,于2015 年标准化。该标准已在大多数现代浏览器中部分实现。

以下是ES5 和ES6 之间的一些主要区别:

1. 箭头功能

constgreetings=(name)={return `hello ${name}`;} 也可以这样写:

const 问候语=name=`你好${name}`;2.常量

const 表示变量的原始值不能被修改。需要注意的是,const 表示对值的常量引用。我们可以更改引用对象的属性值,但不能更改引用本身。

const NAMES=[];NAMES.push('吉姆');console.log(NAMES.length===1); //trueNAMES=['史蒂夫', '约翰']; //错误3。块作用域

在ES6 中,let 和const 将创建块级作用域,并且不会像使用var 声明的变量那样被提升。

4. 默认参数

默认参数允许我们使用默认值初始化函数。当参数被省略或未定义时,使用默认参数值。

函数乘法(a,b=2){返回a * b;}乘法(5); //105. 类定义和继承

ES6 引入了对类(class 关键字)、构造函数(constructor 关键字)和extends 关键字(用于继承)的语言支持。

6. for-of 运算符

for.of 语句创建一个迭代可迭代对象的循环。

7. 扩展运算符

const obj1={ a: 1, b: 2 } const obj2={ a: 2, c: 3, d: 4} const obj3={.obj1,obj2} 8. Promise

Promise 提供了一种处理异步操作的结果和错误的机制。使用回调可以完成同样的事情,但是Promise 通过方法链接和简洁的错误处理来提高可读性。

const isGreater=(a, b)={return new Promise ((resolve,reject)={if(a b) {resolve(true)} else {reject(false)}})}isGreater(1, 2) .then( result={ console.log('greater')}) .catch(result={ console.log('smaller')}) 9. 模块导出和导入

const myModule={ x: 1, y: ()={ console.log('This is ES5') }}export default myModule;import myModule from './myModule';为什么使用ES6 类?选择使用类的一些原因:

1.语法更简单,不易出错。

2. 使用新语法比旧语法更容易(并且更不容易出错)设置继承层次结构。

3.类可以避免在构造函数中使用new的常见错误(如果不是有效对象则使构造函数抛出异常)。

4. 调用父原型方法的新语法比旧语法简单得多。使用super.method() 而不是ParentConstructor.prototype.method.call(this) 或Object.getPrototypeOf(Object.getPrototypeOf(this)).method .call(this)

何时不使用箭头函数举出三个或更多示例1. 当使用函数作为构造函数时(箭头函数没有构造函数)

2.当你想在函数中使用this/arguments时,由于箭头函数本身没有this/arguments,它们依赖于外部上下文

3、当你想让函数提升时(箭头函数是匿名的)

4.当你想在对象字面量中添加一个函数作为属性并使用其中的对象时,因为我们无法访问this,即对象本身。

6.4. ES6 Map 和WeakMap 有什么区别?当它们的键/值引用的对象被删除时,它们的行为都不同,以下面的代码为例:

var map=new Map()varweakmap=new WeakMap()(function() { var a={ x: 12}; var b={ y: 12};map.set(a, 1);weakmap.set(b, 2);})()执行上面的IIFE,不能再引用{x: 12}和{y: 12}。垃圾收集器继续并从WeakMap 中删除键b 指针,并从内存中删除{y:12}。

1.在使用Map的情况下,垃圾收集器不会从Map中删除指针,也不会从内存中删除{x:12}

2.WeakMap允许垃圾收集器执行其回收任务,而Map则不允许。对于手动编写的Map,数组将保留对关键对象的引用以防止垃圾回收。但在WeakMap 中,对关键对象的引用被“弱”保留,这意味着它们不会在不被其他对象引用的情况下阻止垃圾回收。

给出一个柯里化函数的例子并解释柯里化的好处?柯里化是一种模式,其中具有多个参数的函数被分解为多个函数,这些函数在串行调用时,一次累积一个所需的所有参数。这种技术有助于以函数式风格编写的代码更易于阅读和编写。需要注意的是,要实现一个函数,需要从一个函数开始,然后将其分解为一系列函数,每个函数接受一个参数。

函数curry(fn) {if (fn.length===0) {return fn;}function _curried(深度, args) {return 函数(newArgument) {if (深度- 1===0) {return fn(.args, newArgument);}return _curried(深度- 1, [.args, newArgument]);};}return _curried(fn.length, []);}function add(a, b) {return a + b;}var curriedAdd=curry(add);var addFive=curriedAdd(5);var result=[0, 1, 2, 3, 4, 5].map(addFive); //[5, 6, 7, 8, 9, 10]

为您推荐

5月25日大陆地区GRE考试都考了些什么?(gre在大陆有考点吗)

5月25日大陆的考试如期结束,考试结束后,真经GRE的老师们立即采访了从考场出来的各位同学,为大家整理了考试真题的回忆内容。希望大家认真完成下面题目,为自己的考试做准备。当然这些题目大部分还配有巍哥、博哥、小可爱、路莎四位GRE行业的顶级名

2024-06-10 21:07

4月20日大陆地区GRE考试都考了什么?(gre test at home大陆)

4月20日大陆的考试如期结束,在考试结束后,真经GRE的老师们立即采访了从考场出来的各位同学,为大家整理了考试真题的回忆内容。希望大家认真完成下面题目,为自己的考试做准备。当然这些题目大部分还配有巍哥、博哥、小可爱三位GRE行业的顶级名师的

2024-06-10 21:07

泛型面试题库:20道经典题目,助你提升泛型理解(泛型的原理)

泛型什么是泛型?它与类型参数化有什么不同?什么是泛型?泛型是程序设计语言的一种特性,它允许在定义类、接口、方法时使用类型参数。在真正使用时指定具体类型,所有使用该泛型参数的地方都被统一化,保证类型一致。类型参数化是将类型参数应用于已有代码的

2024-06-10 21:06

考试将近,如何高效和GRE“分手”

我们常说,GRE学习三大要素是:词汇、方法逻辑、机经。词汇主要服务于填空,是填空的基础。方法逻辑是GRE的核心,阅读、填空和写作想得高分必须用”逻辑推理“。数学则是考知识点+越来越深的”套路“。机经是不断熟悉方法逻辑和题型的工具,如果你运气

2024-06-10 21:06

注意!GRE写作题库又更新题目了,gre题库作文范文

今年,GRE官方在写作部分又给大家上新了三道Argument题目。话不多说,一起来看看新题~01The following is a memo from the marketing director of Lamfonz Pet Store

2024-06-10 21:05

10月20日GRE考试大陆地区最快最全真题回顾 gre考试2021

一、数学部分x大于1000,比较三次根号x 和 x/100的大小关系有5个礼物,其中2个是cash,3个是gift,不放回地抽取抽2次,问至少抽到一次cash的概率是多少100-1000种7的倍数有多少个216个相同的立方体构成一个大的立方

2024-06-10 21:05

加载中...