JavaScript之ES6快速入门，15个经典面试问题及回答思路

来看下前端的发展历程:

web1.0时代:

• 最初的网页以HTML为主，是纯静态的网页。网页是只读的，信息流只能从服务的到客户端单向流通。开发人员也只关心页面的样式和内容即可。

web2.O时代:

• 1995年，网景工程师Brendan Eich花了10天时间设计了JavaScript语言，

• 1996年，微软发布了JScript，其实是JavaScript的逆向工程实现。

• 1997年，为了统一各种不同script脚本语言，ECMA(欧洲计算机制造商协会)以JavaScript为基础，制定了ECNAscript标准规范。JavaScript和JScript都是 BCMAscript的标准实现者，随后各大浏览器厂商纷纷实现ECMAscript标准。

所以，ECMAScript是浏览器脚本语言的规范，而各种我们熟知的js语言，如JavaScript则是规范的具体实现。

2、ECMAScript的快速发展

而后，ECMAScript就进入了快速发展期。

• 1998年6月，ECMAScript 2.0发布。

• 1999年12月，ECMAScript 3.0 发布。

这时，ECMAScript规范本身也相对比较完善和稳定了，但是接下来的事情，就比较悲剧了.

• 2007年10月。 ECMAScript 4.0草案发布。

这次的新规范，历时颜久，规范的新内容也有了很多争议。在制定ES4的时候，是分成了两个工作组同时工作的。

一边是以Adobe,Mozilla, Opera和Google为主的 ECMAScript 4工作组。一边是以 Microsoft和 Yahoo为主的 ECMAScript 3.1工作组。

ECMAScript 4的很多主张比较激进，改动较大。而ECMAScript 3.1则主张小幅更新。

最终经过TC39的会议，决定将一部分不那么激进的改动保留发布为ECMAScript 3.1，而ES4的内容，则延续到了后来的

ECMAScript56版本中

• 2009年12月.ECMAScript 5发布。2011年6月，ECMAScript S.1发布。

• 2011年6月，ECMMAScript S.1发布。

• 2015年6月，ECMAScript 6，也就是ECMAScript 2015发布了，并且从 ECMAScript 6开始，开始采用年号来傲版本。EECMAScript 2075，就是ECMAScript6.

3、ES5和6的一些新特性

(1)var默认为全局变量

之前，js定义变量只有一个关健字: var

var士有一个问题,就是定义的安量有时会莫名其妙的成为全局变量.例如这样的一段代码:

下打印的结果是什么了

(2)let：局部变量（所声明的变量，只在let命令所在的代码块内有效。）

(3)const：声明的变量是常量,不能被修改

4、解构表达式

数组解构

比如有一个数组:

let arr = [ 1,2,3 ]

我想获取其中的值，只能通过角标。ES6可以这样:

const [ x,y,z] = arr;//x,y，z将与arr中的每个位置对应来取值

//然后打印

console.log(x,y,z);

打开谷歌浏览器

（1）一般的取值方式

let arr = [2,5,-10,15];

let x = arr[0] , y = arr[1];

（2）解构表达式取值：获取前两个值

let arr = [2,5,-10,15];

let[x,y] = arr;

x

2

y

5

（3）解构表达式取值：获取后两个值

let [,a,b] = arr;

undefined

a

-10

b

15

（4）解构表达式取值：获取除了第一个以外的其他所有元素

let [,…rest] = arr;

undefined

rest

(3) [5, -10, 15]

（5）解析对象

let p = {name:“jack”,age:21}

undefined

let {name,age} = p;

undefined

name

“jack”

age

21

（6）解析对象：并更改其变量名称

let p = {name:“jack”,age:21}

undefined

let {name:n} = p;

undefined

n

“jack”

（7）解析复杂对象：

p = {name:“jack”,age:21,girl:{name:“rose”,age:“18”}}

{name: “jack”, age: 21, girl: {…}}

let{girl:{name}} = p;

undefined

name

“rose”

（8）对象的拷贝

let {…obj} = p;

undefined

obj

{name: “jack”, age: 21, girl: {…}}

查看obj是否等同于p

obj == p

false

（9）ES6的函数

定义函数

浏览器控制台调用函数

（10）js创建对象，定义属性和方法

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上前端开发知识点，真正体系化！

由于文件比较大，这里只是将部分目录大纲截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新

如果你觉得这些内容对你有帮助，可以扫码获取（备注前端）

最后

在面试前我花了三个月时间刷了很多大厂面试题，最近做了一个整理并分类，主要内容包括html，css，JavaScript，ES6，计算机网络，浏览器，工程化，模块化，Node.js，框架，数据结构，性能优化，项目等等。

包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目，涵盖了初中级前端技术点。

• HTML5新特性，语义化

• 浏览器的标准模式和怪异模式

• xhtml和html的区别

• 使用data-的好处

• meta标签

• canvas

• HTML废弃的标签

• IE6 bug，和一些定位写法

• css js放置位置和原因

• 什么是渐进式渲染

• html模板语言

• meta viewport原理

容对你有帮助，可以扫码获取（备注前端）**
[外链图片转存中…(img-DoYxKgnE-1711950074808)]

最后

在面试前我花了三个月时间刷了很多大厂面试题，最近做了一个整理并分类，主要内容包括html，css，JavaScript，ES6，计算机网络，浏览器，工程化，模块化，Node.js，框架，数据结构，性能优化，项目等等。

包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目，涵盖了初中级前端技术点。

• HTML5新特性，语义化

• 浏览器的标准模式和怪异模式

• xhtml和html的区别

• 使用data-的好处

• meta标签

• canvas

• HTML废弃的标签

• IE6 bug，和一些定位写法

• css js放置位置和原因

• 什么是渐进式渲染

• html模板语言

• meta viewport原理