刚从学校出来实习面的是一年岗位的面试题,答的不好 欢迎指正!
主页还有html/css,JavaScript的面试题,随后还有vue....持续更新
( 收集不易,看前先点赞养成好习惯~)
自从ES6发布以来,就受到了广大开发者的欢迎。它的新特性解决了很多实际开发中的痛点,并且使得JavaScript逐步成为一门能够开发大型企业应用的编程语言,基于这种技术环境下,很多公司都将ES6视为开发的其中一个标准,因此在招聘人才的时候,也会对其进行ES6知识的考察。
1.var let const 区别
-
(1). var声明的变量会挂载在window上,而let和const声明的变量不会:
var a = 100;
console.log(a,window.a); // 100 100
let b = 10;
console.log(b,window.b); // 10 undefined
const c = 1;
console.log(c,window.c); // 1 undefined
(2). var声明变量存在变量提升,let和const不存在变量提升
console.log(a); // undefined ===> a已声明还没赋值,默认得到undefined值
var a = 100;
console.log(b); // 报错:b is not defined ===> 找不到b这个变量
let b = 10;
console.log(c); // 报错:c is not defined ===> 找不到c这个变量
const c = 10;
(3).let和const声明形成块作用域
if(1){
var a = 100;
let b = 10;
}
console.log(a); // 100
console.log(b) // 报错:b is not defined ===> 找不到b这个变量
if(1){
var a = 100;
const c = 1;
}
console.log(a); // 100
console.log(c) // 报错:c is not defined ===> 找不到c这个变量
(4).同一作用域下let和const不能声明同名变量,而var可以
var a = 100;
console.log(a); // 100
var a = 10;
console.log(a); // 10
let a = 100;
let a = 10;
// 控制台报错:Identifier 'a' has already been declared ===> 标识符a已经被声明了。
-
(5). 暂存死区
var a = 100;
if(1){
a = 10;
//在当前块作用域中存在a使用let/const声明的情况下,给a赋值10时,只会在当前作用域找变量a,
// 而这时,还未到声明时候,所以控制台Error:a is not defined
let a = 1;
}
-
(6).const
1、一旦声明必须赋值,不能使用null占位。
*
* 2、声明后不能再修改
*
* 3、如果声明的是复合类型数据,可以修改其属性
*
* */
const a = 100;
const list = [];
list[0] = 10;
console.log(list); // [10]
const obj = {a:100};
obj.name = 'apple';
obj.a = 10000;
console.log(obj); // {a:10000,name:'apple'}
2. 箭头函数
(1)不需要function关键字来创建函数
- es5创建函数
var aa = function() {}
- es6创建函数
var aa = () => {}
(2)可以极大的简写函数
- es5函数
var fn = function(a) {
return a + 5
}
- 可以利用箭头函数简写为:
var fn = a => a + 5;
- 简写规则:
当函数所传参数只有一个时,可以去掉(); eg: (a) => {} 简写为:a => {}
当函数体中只返回值,而没有其他操作时,可以去掉{};eg: (a, b) => {return a+b} 简写为:(a, b) => a+
(3)当要求动态上下文的时候,就不能够使用箭头函数,也就是this的固定化。
1、在使用=>定义函数的时候,this的指向是定义时所在的对象,而不是使用时所在的对象;
2、不能够用作构造函数,这就是说,不能够使用new命令,否则就会抛出一个错误;
3、不能够使用arguments对象;
4、不能使用yield命令;
3. 数组新增常用的4个方法
(1)map --映射
let arr=[66,59,80];
let result=arr.map(item => {
if(item >= 60){
return "及格"
}else{
return "不及格"
}
});
//result:["及格", "不及格", "及格"]
(2) reduce --汇总
let arr = [12,69,180,8763];
let result = arr.reduce((tmp, item, index) => {
console.log(tmp, item, index);
return tmp + item;
});
console.log(result);//求和
(3)filter --过滤
let arr=[
{title: '电源线', price: 50},
{title: '电脑', price: 13000},
{title: '键盘', price: 120},
{title: '手机', price: 9000}
];
let result=arr.filter(json=>json.price>=5000);
console.log(result);//[{title: '电脑', price: 13000},{title: '手机', price: 9000}]
(4)forEach --迭代
let arr=[12,5,8,9];
arr.forEach((item,index)=>{
console.log(index+': '+item); //0: 12 1: 5 2: 8 3: 9
});
4. 函数的参数
(1)收集参数
function show(a, b, ...args){
console.log(args)
}
show(1,2,3,4,5,6) //输出[3,4,5,6]
(2)展开数组
const arr1 = [1,2,3];
const arr2 = [4,5,6];
console.log([...arr1, ...arr2]); //输出[1,2,3,4,5,6]
console.log(...arr1); //输出1,2,3
(3)默认值
const show = (a=666, b=999) => {
console.log(a); //输出666
console.log(b); //输出999
}
show();
5. 解构赋值
(1)左右两边结构必须一样;
(2)右边必须是个合法的值;
(3)声明和赋值不能分开(必须在一句话里完成);
let [a,b,c]=[1,2,3,999];
let {e,d,g}={e: 4, d: 5, f: 6, g: 7};
console.log(a,b,c,e,d,g);
//输出1 2 3 4 5 7
6. 字符串
(1)多了两个新方法: startsWith endsWith
//startsWith
let str='https//http://mp.blog.csdn.net/postedit/79478118';
if(str.startsWith('http://')){
alert('普通网址');
}else if(str.startsWith('https://')){
alert('加密网址');
}else if(str.startsWith('git://')){
alert('git地址');
}else if(str.startsWith('svn://')){
alert('svn地址');
}else{
alert('其他');
}
//endsWith
let str='12121.png';
if(str.endsWith('.txt')){
alert('文本文件');
}else if(str.endsWith('.jpg')){
alert('JPG图片');
}else{
alert('其他');
}
(2)字符串模板
优点:方便字符串拼接;可以折行
let title='标题';
let content='内容';
let str='<div>\
<h1>'+title+'</h1>\
<p>'+content+'</p>\
</div>';
let str2=`<div>
<h1>${title}</h1>
<p>${content}</p>
</div>`;
7. promise 实现原理? promise的三种状态
promise实际上解决jquery的ajax回调地域(解决层层嵌套),只是异步编程的一种解决方案
new promise(function(resolve,reject) {
// 111111111
resolve('...')
} ).then(function(value) {
console.log(value)
}).catch(function(error){
console.log(error)
})
const p1 = new Promise(function (resolve, reject) {
setTimeout(() => reject(new Error('fail')), 3000)
})
const p2 = new Promise(function (resolve, reject) {
setTimeout(() => resolve(p1), 1000)
})
p2
.then(result => console.log(result))
.catch(error => console.log(error))
三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)
promise两个特点:
(1)对象的状态不受外界影响
(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。
promise 缺点: 无法取消promise,如果不设置回调函数,promise内部抛出错误
第三,当处于pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
8.对es6的了解
ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。
写在最后
暂时总结这么多还会持续更新~
收集不易如果觉得对您有用就动动手点个赞个关注支持一下吧
收藏总有用武之地,谢谢~