JavaScript前端面试题总结

一、em和rem

像素（px）：用于元素的边框或定位。

em/rem：用于作响应式页面，em相对于父元素，rem相对于根元素。

• rem 单位翻译为像素值是由 html 元素的字体大小决定的。 此字体大小会被浏览器中字体大小的设置影响，除非显式重写一个具体单位。
• em 单位转为像素值，取决于他们使用的字体大小。 此字体大小受从父元素继承过来的字体大小，除非显式重写与一个具体单位。

二、语义化标签

定义：命名或者标签有意义，可以直观的看出来是什么意思

h5新增的标签：header、nav（导航）、footer、vedio、audio、time、section（章节）、artical、aside

三、ES6新特性

ES52009年发布 ES62015年发布

• 模板字符串
• let和const
• for of 只循环访问对象的中值
• ···res接受剩余的实参
• 箭头函数 const greet = name => Hello ${name}!;
• JavaScript中标准函数this

四、css3新特性

• 新增各类css选择器
• 圆角 border-radius
• 多列布局
• 阴影和反射
• 文字特效text-shadow
• 线性渐变
• 旋转transform

五、css3新增的伪类

• p:first-of-type 选择属于其父元素的首个p元素的每一个p元素。
• p:last-of-type 选择属于其父元素的最后p元素的每一个p元素。
• p:only-of-type 选择属于其父元素惟一的p元素的每一个p元素。
• p:only-child 选择属于其父元素的惟一子元素的每一个p元素。
• p:nth-child(2) 选择属于其父元素的第二个子元素的每一个p元素。
• :after 在元素以前添加内容,也能够用来作清除浮动。
• :before 在元素以后添加内容。
• :enabled 已启用的表单元素。
• :disabled 已禁用的表单元素。
• :checked 单选框或复选框被选中。

六、闭包函数、原型、原型链；做用域、做用域链

闭包函数定义： 定义：当两个函数发生嵌套关系时，内层函数使用外层函数的变量，并在全局环境下调用内层函数保护内部变量不别清理掉

做用域定义：能够访问变量的集合。全局做用域：在全局或任何地方均可以起做用的变量，任何地方均可以修改；局部做用域：- 定义在函数内部的变量、函数的形参

做用域链：咱们能够把做用域当作是用链条链接起来的，这样可以使得函数能有序的进行运行：里层函数能够访问外层函数的变量，可是外层函数不能够访问里层函数的变量

每一个对象都会在其内部初始化一个属性，就是prototype(原型)，当咱们访问一个对象的属性时 若是这个对象内部不存在这个属性，那么他就会去prototype里找这个属性，这个prototype又会有本身的prototype，因而就这样一直找下去，也就是咱们平时所说的原型链的概念

关系：instance.constructor.prototype = instance.proto

特色：JavaScript对象是经过引用来传递的，咱们建立的每一个新对象实体中并无一份属于本身的原型副本。当咱们修改原型时，与之相关的对象也会继承这一改变当咱们须要一个属性的时，Javascript引擎会先看当前对象中是否有这个属性， 若是没有的 就会查找他的Prototype对象是否有这个属性，如此递推下去，一直检索到 Object 内建对象

七、浏览器优化

• 雪碧图：雪碧图是根据CSS sprite音译过来的，就是将不少不少的小图标放在一张图片上，就称之为雪碧图。
• 图片精灵技术

八、 请描述一下 cookies，sessionStorage 和 localStorage 的区别？

• cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（一般通过加密）

• cookie数据始终在同源的http请求中携带（即便不须要），记会在浏览器和服务器间来回传递

• sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存

• 存储大小：

  • cookie数据大小不能超过4k
  • sessionStorage和localStorage虽然也有存储大小的限制，但比cookie大得多，能够达到5M或更大

• 有期时间：

  • localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据
  • sessionStorage 数据在当前浏览器窗口关闭后自动删除
  • cookie 设置的cookie过时时间以前一直有效，即便窗口或浏览器关闭

九、http中的get和post请求区别

http://www.w3school.com.cn/tags/html_ref_httpmethods.asp

十、三种传输方式put、delter

十一、浏览器内核

IE——>IE内核 谷歌——>wbbkit内核 火狐——>gecko（火狐）内核

12.简述一下src与href的区别

src用于替换当前元素，href用于在当前文档和引用资源之间确立联系。

• src是source的缩写，指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置；在请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片和frame等元素
• href是Hypertext Reference的缩写，指向网络资源所在位置，创建和当前元素（锚点）或当前文档（连接）之间的连接，若是咱们在文档中添加

13.HTML、JavaScript

HTML：超文本标记语言

python：面向对象的动态类型，强类型语言

JavaScript：基于对象和事件驱动的松散型、解释性语言，寄宿于浏览器，单线程异步

JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言内置支持类型，他的解释器被称为JavaScript引擎，为浏览器的一部分，普遍用于客户端的脚本语言，用来给html网页增长动态功能。

• 基于对象/基于原型：面向对象的开发语言；

• 事件驱动：全部的效果都是经过事件触发一系列代码实现的；

• 解释性：不须要编译，寄宿于浏览器，不须要运行环境；

• 松散型：要求i没有严格；没有那么严谨；

• 动态类型：变量，能够加效果，动态的变化

• 弱类型：对类型没有那么严格，好比字符串能够跟数字相加

• 基于原型的：内置支持类型；

1四、自动换行三行代码

 word-wrap:break-word; word-break:break-all; overflow: hidden; word-wrap:break-word; word-break:break-all; overflow: hidden;

1五、选择器的优先级

!important > 行内样式 > #id > .class > tag > * > 继承 > 默认

选择器 从右往左 解析

1六、new操做符具体干了哪些事？

• 建立一个空对象，而且 this 变量引用该对象，同时还继承了该函数的原型
• 属性和方法被加入到 this 引用的对象中
• 新建立的对象由 this 所引用，而且最后隐式的返回 this

1七、this指向

• this的指向在函数定义的时候是肯定不了的，只有函数执行的时候才能肯定this到底指向谁，实际上this的最终指向的是那个调用它的对象
• 《javascript语言精髓》中大概归纳了4种调用方式：
• 方法调用模式
• 函数调用模式
• 构造器调用模式
• apply/call调用模式

1八、深浅拷贝

• 浅拷贝：是一个传址,也就是把a的值赋给b的时候同时也把a的址赋给了b，当b（a）的值改变的时候，a（b）的值同时也会改变

• 深拷贝：深拷贝是指，拷贝对象的具体内容，二内存地址是自主分配的，拷贝结束以后俩个对象虽然存的值是同样的，可是内存地址不同，俩个对象页互相不影响，互不干涉

• 初始数据类型和引用数据类型的区别：分别放在栈区和堆区，栈区和堆区的区别：栈区放置变量和函数名，执行完程序自动删除，堆区放置引用的数据，能够本身删除，也会被js的垃圾回收处理删除

1九、JavaScript发展的时间轴：

一、1995：JavaScript诞生，它的初始名叫LiveScript。
二、1997：ECMAScript标准确立。
三、1999：ES3出现，与此同时IE5风靡一时。
四、2000–2005： XMLHttpRequest又名AJAX。
五、2009： ES5出现，也就是咱们如今用的，例如foreach，Object.keys，Object.create和JSON标准。
六、2015：ES6/ECMAScript2015出现