1.css新特性有哪些
（1）选择器
1）E:last-child 匹配父元素的最后一个子元素E。
2）E:nth-child(n)匹配父元素的第n个子元素E。
3）E:nth-last-child(n) CSS3 匹配父元素的倒数第n个子元素E。
（2）圆角
border-radius: 15px;
（3）阴影（Shadow）
.class1{
text-shadow:5px 2px 6px rgba(64, 64, 64, 0.5);
}
（4）CSS3 的渐变效果
background-image:-webkit-gradient(linear,0% 0%,100% 0%,from(#2A8BBE),to(#FE280E));
（5）淘宝网字体使用
@font-face {
font-family: iconfont;
src: url(//at.alicdn.com/t/font_1465189805_4518812.eot);
}
2.es6常见面试题
（1）箭头函数 =>
箭头函数需要注意的地方
当要求动态上下文的时候，就不能够使用箭头函数，也就是this的固定化。
1、在使用=>定义函数的时候，this的指向是定义时所在的对象，而不是使用时所在的对象；
2、不能够用作构造函数，这就是说，不能够使用new命令，否则就会抛出一个错误；
3、不能够使用arguments对象；
4、不能使用yield命令；
【特点】
不需要function关键字来创建函数
省略return关键字
继承当前上下文的 this 关键字
(2)let和const
let是更完美的var，不是全局变量，具有块级函数作用域,大多数情况不会发生变量提升。const定义常量值，不能够重新赋值，如果值是一个对象，可以改变对象里边的属性值。
1、let声明的变量具有块级作用域
2、let声明的变量不能通过window.变量名进行访问
3、形如for(let x…)的循环是每次迭代都为x创建新的绑定
面试题：
把以下代码使用两种方法，依次输出0-9
var funcs = []
for (var i = 0; i < 10; i++) {
funcs.push(function () {
console.log(i)
})
}
funcs.forEach(function (func) {
func(); //输出十个10
})
方法一：使用立即执行函数
var funcs = []
for (var i = 0; i < 10; i++) {
funcs.push((function (value) {
return function () {
console.log(value)
}
}(i)))
}
funcs.forEach(function (func) {
func(); //依次输出0-9
})
方法二：使用闭包
function show(i) {
return function () {
console.log(i)
}
}
var funcs = []
for (var i = 0; i < 10; i++) {
funcs.push(show(i))
}
funcs.forEach(function (func) {
func(); //0 1 2 3 4 5 6 7 8 9
})
方法三：使用let
var funcs = []
for (let i = 0; i < 10; i++) {
funcs.push(function () {
console.log(i)
})
}
funcs.forEach(function (func) {
func(); //依次输出0-9
})
（3）Set数据结构
es6方法,Set本身是一个构造函数，它类似于数组，但是成员值都是唯一的。
const set = new Set([1,2,3,4,4])
console.log([...set] )// [1,2,3,4]
console.log(Array.from(new Set([2,3,3,5,6]))); //[2,3,5,6]
（4）重点“人物”：Promise！
概念：Promise是异步编程的一种解决方案，比传统的解决方案（回调函数和事件）更合合理、强大。所谓Promise，简单来说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promies是一个对象，从它可以获取异步操作的消息。Promise提供统一的API，各种异步操作都可以用同样的方法进行处理。处理过程流程图：
面试题：手写一个promise
var promise = new Promise((resolve, reject) => {
if (操作成功) {
resolve(value)
} else {
reject(error)
}
})
promise.then(function (value) {
// success
}, function (value) {
// failure
})
3.怎么使超出部分以省略号显示
overflow:hidden;/*超出部分隐藏*/
text-overflow:elipsis;/*超出部分以省略号显示*/
white-space:nowrap;/*强制不换号*/
4.apply和call的用法和区别
JavaScript中的每一个Function对象都有一个apply()方法和一个call()方法，它们的语法分别为：
/*apply()方法*/
function.apply(thisObj[, argArray])
/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);
它们各自的定义：
apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A, arguments);即A对象应用B对象的方法。
call：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.call(A, args1,args2);即A对象调用B对象的方法。
它们的共同之处：
都“可以用来代替另一个对象调用一个方法，将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象”。
它们的不同之处：
apply：最多只能有两个参数——新this对象和一个数组argArray。如果给该方法传递多个参数，则把参数都写进这个数组里面，当然，即使只有一个参数，也要写进数组里。如果argArray不是一个有效的数组或arguments对象，那么将导致一个TypeError。如果没有提供argArray和thisObj任何一个参数，那么Global对象将被用作thisObj，并且无法被传递任何参数。
call：它可以接受多个参数，第一个参数与apply一样，后面则是一串参数列表。这个方法主要用在js对象各方法相互调用的时候，使当前this实例指针保持一致，或者在特殊情况下需要改变this指针。如果没有提供thisObj参数，那么 Global 对象被用作thisObj。
实际上，apply和call的功能是一样的，只是传入的参数列表形式不同。
（1）基本用法
function add(a,b){
return a+b;
}
function sub(a,b){
return a-b;
}
var a1 = add.apply(sub,[4,2]); //sub调用add的方法
var a2 = sub.apply(add,[4,2]);
alert(a1); //6
alert(a2); //2
/*call的用法*/
var a1 = add.call(sub,4,2);
5.块级元素、行级元素以及空元素有哪些
行内元素：a、b、span、img、input、strong、select、label、em、button、textarea
块级元素：div、ul、li、dl、dt、dd、p、h1-h6、blockquote
空元素:br、meta、hr、link、input、img
6.display:none与visible:hidden的区别
display:none和visible:hidden都能把网页上某个元素隐藏起来，但两者有区别:
display:none —不为被隐藏的对象保留其物理空间，即该对象在页面上彻底消失，通俗来说就是看不见也摸不到。
visible:hidden— 使对象在网页上不可见，但该对象在网页上所占的空间没有改变，通俗来说就是看不见但摸得到。
7.block、inline、inline-block各表示什么
（1）什么是inline、block、inline-block元素？
如果只用一句话描述:inline是内联元素，block是块级元素，inline-block是内联块元素。
inline:一个内联元素不会开始新的一行，并且只占有必要的宽度。
常见的块元素有a、b、span、img、input、strong、select、label、em、button、textarea
block:一个块级元素总是开始新的一行，并且占据可获得的全部宽度(左右都会尽可能的延伸到它能延伸的最远)
常见的块元素有div、p、h1…h6、ol、ul、dl、table、address、blockquote 、form。
inline-block:它像内联元素，但具有宽度和高度。
常见的内联块元素：img、input
（2）各自具有什么特点？
inline元素:
(1)、和其他元素都在一行上；
(2)、元素的高度、宽度、行高及顶部和底部边距不可设置；
(3)、元素的宽度就是它包含的文字或图片的宽度，不可改变。
block元素：
(1)、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（一个块级元素独占一行）;
(2)、元素的高度、宽度、行高以及顶和底边距都可设置;
(3)、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。
inline-block元素:
(1)、和其他元素都在一行上；
(2)、元素的高度、宽度、行高以及顶和底边距都可设置
（3）互相之间的区别
区别主要是三个方面:一是排列方式，二是宽高边距设置，三是默认宽度。(1)块级元素会独占一行，而内联元素和内联块元素则会在一行内显示。(2)块级元素和内联块元素可以设置 width、height 属性，而内联元素设置无效。(3)块级元素的 width 默认为 100%，而内联元素则是根据其自身的内容或子元素来决定其宽度。
作者：大大头大
链接：https://www.jianshu.com/p/cca9f037a6b9
来源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。
（4）常见问题
插入img下面会有空白
解决：
1、给图片img标签display:block
2、定义图片img标签vertical-align:bottom，vertical-align:middle，vertical-align:top。
3、定义容器里的字体大小font-size为0。
8.attribute和property的区别
基本概念区别
attribute：是HTML标签上的某个属性，如id、class、value等以及自定义属性，它的值只能是字符串，关于这个属性一共有三个相关的方法，setAttribute、getAttribute、removeAttribute；
注意：在使用setAttribute的时候，该函数一定接收两个参数setAttribute（attributeName,value）,无论value的值是什么类型都会编译为字符串类型。在html标签中添加属性，本质上是跟在标签里面写属性时一样的，所以属性值最终都会编译为字符串类型。
property：是js获取的DOM对象上的属性值，比如a，你可以将它看作为一个基本的js对象。这个节点包括很多property，比如value，className以及一些方法onclik等方法。
1、property和attributies都是properties的子集，而每个attribute是attributies的子集；
2、attribute可以理解为特性，可以自定义，直接在html标签上添加的和使用setAttribute添加的情况一致，即html标签添加的都是attribute属性， property则是使用xx.属性进行更改，通常来讲，更改互相影响（value除外）
3、当添加新的非默认属性时，是不互通的；
4、一些特殊属性，则需要特殊对待。
作者：zhy前端攻城狮
来源：CSDN
原文：https://blog.csdn.net/zhy13087344578/article/details/79036967
版权声明：本文为博主原创文章，转载请附上博文链接！
9.session,cookie,sessionStorage,localStorage的区别及应用场景
参考：https://blog.csdn.net/weixin_43387238/article/details/88952419