近来口试几家前端职位，想晓得现在的前端口试题是倾向哪一块，都重要问到的是ES6语法，闭包，原型链，继续那一块。而且将口试题的知识点汇总一下。有助于下次口试。
1.HTML
HTML5新特征，语义化
HTML5新增了许多标签<header>,<main>,<footer>,<nav><section>,<article>,<aside>,还用了<canvas>画图,<video>视频,<audio>音频.当地贮存localstorage,sessionstorage,定位,离线缓存等。
HTML5新特征
长处：
SEO(搜索引擎优化);组织越发清楚，轻易保护.
浏览器的规范情势和奇异情势
在W3C还没有制订出规范之前,差异的浏览器有属于本身一套规范.差异浏览器会依据本身的划定规矩衬着页面.那末衬着出来的页面就差异,为奇异情势。那末W3C制订出一系列规范划定规矩今后。浏览器按这套划定规矩衬着页面那就是规范情势
xhtml和html的区分
1.xhtml内里的标签必需闭合。
2.xhtml内里的标签必需小写。
3.xhtml内里必需嵌套元素是准确的。
运用data-的优点
1.自定义属性可以统一化。
2.今后保护越发的轻易,页面组织清楚
3.element.dataset.猎取信息 <element data-*=”somevalue”>
<div data-main="main"></div>
var main = document.querySeletor('div');
console.log(div.dataset.main); //main
meta标签
meta标签寻常表述当前文档的属性.比方作者关键字等等信息。
细致相识参考https://www.cnblogs.com/reaf/…
canvas
canvas是一个HTML5供应的画图API,经由历程getContent()要领猎取画笔才可画图。与svg的最大差异是svg运用一个 XML 文档来形貌画图.
HTML烧毁的标签
<iframe><font><s>等等。觉得也没什么用,寻常都很罕用获得的标签。
IE6 bug，和一些定位写法
1.双边距bug：当元素运用float事后，运用margin都邑有两倍边距，须要明白其元素范例来处置惩罚边距题目. display:inline或display:block;
2.相对父容器相对定位bug
ie6许多bug可以经由历程触发layout来处置惩罚。不管设置zoom:1或许设置宽高都能触发。
参考链接
IE6中的罕见BUG
IE6相对父容器相对定位的bug及其处置惩罚办法
css js安排位置和缘由
寻常来讲css和js都是经由历程外部引入的。如许轻易保护治理。
因为浏览器的加载递次,css放在head标签中,js会壅塞html加载。我发起页面结果显现的js放在body之前，交互，事宜的js可以放在背面。
什么是渐进式衬着
浏览器的衬着：历程与道理
What is progressive rendering?
html模板言语
寻常寻常的数据衬着,须要用字符串与数据一个个拼接而成,但后期保护很贫苦。因而有了html模板。差异的html模板可以写法也差异。es6有一种是叫模板字符串 数据经由历程#{}并接而成.
meta viewport
2 CSS
CSS3新特征，伪类，伪元素
css3增加了许多新的特征,但兼容的话寻常在IE9+,比方box-sizing,CSS选择器,背景background-size,边框暗影,圆角等等.
伪类一个冒号: 伪元素两个冒号:: 权重级别不一样
:first-child :hover :active
::before ::after 兼容性不好
伪类伪元素
寻经常使用于真正的内容用伪类,但伪元素用于比方图标之类的没有什么本质的内容。
伪类与伪元素差异
CSS完成隐蔽页面的体式格局
display:none元素隐蔽.页面宽高不显现.不占页面位置.
opactiy: 0 只是将透明度设置为0,但占页面位置.
visibilty: hidden 也是隐蔽元素
link和@import引入css的区分
link标签援用在head标签内里,@import 援用于在CSS款式表中。
加载递次题目.link是在页面加载的时刻可以同时加载CSS ,@import须要在加载页面内容今后才加载
link兼容性比@import好些。
flexbox弹性盒子
寻常运用于挪动端和高等浏览器.运用了弹性规划那末float,clear,vertical-align都邑失效。
有分主轴和交织轴。
完成两栏规划有哪些要领？
1.float要领完成
2.flex规划完成
CSS优先级
寻常以援用的款式来讲 内联款式 > 内部款式 > 外部款式（就近准绳）
权重级别
important 第一流
行内 +1000
id +100
属性选择器,类,伪类 +10
元素,伪元素 +1
通用符* 0
CSS权重
3.JS
js的基础范例有哪些？援用范例有哪些？null和undefined的区分?string包装对象和基础范例区分
基础范例: null,undefined,number,string,boolean
援用范例: object => function,(number,string,boolean)包装对象,Date等等。
基础范例属于栈
援用范例属于堆
null和undefined的区分
null是接见一个还没有存在的对象时所返回的值。 转换成数值范例为 0
undefined是接见一个未初始化的变量时返回的值。 转换数值范例为NaN.
包装对象与基础范例的区分
没法在基础范例上增加要领属性。
包装对象可以增加属性。
轻松明白JS基础包装对象
推断是不是是Array范例
1.经由历程instanceof 推断原型对象是不是指向Array组织对象
arr instanceof Array // true
2.对象的constructor属性
arr.constructor = Array // true
解释一下事宜冒泡和事宜捕捉
寻常一个事宜触发时刻会举行事宜流，而事宜流有两个阶段一个就是从外到里为捕捉阶段，从里到外是冒泡阶段。
阻挠冒泡要领
function stop(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
}对闭包的明白？什么时刻组成闭包？闭包的完成要领？闭包的优瑕玷
闭包是外部能接见内部变量的函数。寻常来讲内部定义的函数能接见到外部的变量。但外部没法接见内部函数内里定义的变量。
function a(){
var i = 0;
function b(){
console.log(i)
return b;
}
}如许就形成了闭包，当外部定义个变量时刻，吸收a函数的返回值,实行这个函数就可以猎取到这个变量。
长处 处置惩罚外部没法猎取内部函数的值
瑕玷 闭包会使得这个变量一向占有内存中。
this有哪些运用场景
this 指向用于三种场景
1.在组织函数中要领运用this，这this指向实例。
2.事宜中运用this,这this指向对应的dom元素
3.全局要领运用this。会实行window.假如是node环境下。指向global
call，apply，bind
call，apply 都是转变函数实行上下文。
call与apply就一个区分就是传入参数的题目。call是一个个传入，apply是以数组的情势传入。
而bind是返回一个函数副本。他不会实行函数。须要本身手动实行函数。
聊一聊call、apply、bind的区分
显现原型和隐式原型，手绘原型链，原型链是什么？为何要有原型链
http://www.cnblogs.com/wangfu…
建立对象的多种体式格局
1.直接用字面量建立
var obj = {}2.组织函数建立
function obj(){}
var obj1 = new obj;3.直接经由历程new object()建立
4.工场函数建立
变量提拔
在Javascript中，变量声明和函数声明会最早实行。
函数声明大于变量声明
比方
function a(){}
var a;
console.log(a) // function a(){}函数声明
function a(){}函数表达式
var a = function(){} 等同于 var a = 1;宿主对象和原生对象（内部对象）的区分
宿主对象 是浏览器供应的对象 BOM如Window和Document等 DOM对象
原生对象（内部对象）是指JS内置的对象 String Number Boolean Date
另有本身定义的对象 自定义对象。
document load和document DOMContentLoaded两个事宜的区分
document DOMContentLoaded是DOM加载终了会实行这个函数 等同于JQ中的$(function(){})
document load 是JS加载完成才实行这个函数
typeof可以获得哪些值
“number”、”string”、”boolean”、”object”、”function” 和 “undefined”
注重 typeof null , array,{} 都检测出object
什么是“use strict”,优点和害处
优点: 1.使得JS语法越发规范化。现在的ES6是严厉情势。2.能早点发明代码的毛病题目，进步代码的安全性。
害处: 寻常网站都邑将JS代码举行紧缩，然则有些JS代码有严厉情势，而有些代码没有严厉情势。当他们兼并在一起，会糟蹋字节。
函数作用域是什么？js 的作用域有几种？
函数作用域是函数内里有作用域，比方在函数体中定义个变量，在外部接见不到这个变量的。
JS作用域中有三种。全局作用域，函数作用域，块级作用域。es6语法才支撑块级作用域。
数组经常使用API 字符串api
Array
增： arr.push() arr.unshift()
删： arr.pop() arr.shift()
改： arr.reverse() arr.sort() arr.concat() arr.join() arr.slice() arr.splice() arr.toString()
查： arr.indexOf() arr.lastIndexOf()
数组经常使用API
String
字符串经常使用API
浅拷贝和深拷贝
http://www.jb51.net/article/9…
编写一个通用的事宜监听函数
https://blog.csdn.net/github_…
web端cookie的设置和猎取
原生事宜绑定（跨浏览器），dom0和dom2的区分？
dom0
ele.onclick = handler;ele.onclick=null;最陈旧的一种体式格局
长处：全浏览器兼容
瑕玷：统一事宜只能绑定/解绑一个事宜处置惩罚器
ele.add/removeEventListener(eventType, handler, catch);
和IE体式格局：ele.attach/detachEvent(‘on’+eventType, handler);
长处：支撑绑定/解绑多个事宜处置惩罚器
瑕玷：须要做兼容性推断。
怎样完成图片转动懒加载
懒加载道理是图片还没到可视地区时先用一张很小的图片来当背景，假如转动到可视地区时，再加载图片途径。
转动加载图片（懒加载）完成道理
cookie猎取设置删除
https://blog.csdn.net/qiqingj…
DOM事宜的绑定的几种体式格局
三种绑定事宜的体式格局
1.直接在DOM 上面绑定
2.经由历程剧本内里绑定
3.经由历程监听事宜绑定
https://www.cnblogs.com/mylov…
js的设想情势晓得哪些
工场情势 Factory Pattern,
单例情势 Singleton Pattern,
模块情势,
宣布定阅情势，
中介者情势 Mediator Pattern，
代办情势 Proxy Pattern
https://www.cnblogs.com/tugen…
4.ES6
谈一谈 promise
promise对象重要处置惩罚回调函数的对象。实例化一个promise对象今后有三种状况 pending: 初始状况，既不是胜利，也不是失利状况。
fulfilled: 意味着操纵胜利完成，rejected: 意味着操纵失利。
实例化promise对象有两个参数 resolve 和 reject 。
promise实例化天生今后可以经由历程then() 和catch()链式挪用自定义要领。
参考网站
口试题
图片过量的时刻怎样优化
1.图标许多的时刻可以用雪碧图
2.图片过大时刻可以紧缩一下。
3.小图标假如不必雪碧图可以斟酌用base64编码
4.图片缓存
怎样将字符串中的字符用空格离隔
function aaa(str){
return str.split("").join(" ");
}
aaa('123'); // 1 2 3怎样猎取checkbox的元素,用JS怎样写
document.getElementsByName(“”) 猎取一切name属性的元素
其次另有document.getElementsByTagName() 猎取标签元素
document.getElementById 猎取ID
document.getElementsByClassName 猎取类名
JS JQ 增编削查要领
JS
createElement //建立一个元素
createTextNode //建立一个文本节点
JQ
$(“<div>123</div>”)
增加，移除，插进去
JS
insertBefore() // 被选元素的前面插进去
appendChild() // 被选元素的背面插进去
removeChild() // 删除
JQ
append() //被选元素插进去内容
prepend()
remove()
insertAfter() //被选元素的前面插进去
instetBefore()
