前端面试题100道，内含答案（大厂校招秋招8）

七十一.js数据类型

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、**Symbol**。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。

七十二.减少页面加载时间的方法

1.尽量减少页面中重复的HTTP请求数量
2.服务器开启gzip压缩
3. css样式的定义放置在文件头部
4. Javascript脚本放在文件末尾
5.压缩合并Javascript、CSS代码
6.使用多域名负载网页内的多个文件、图片

七十三.怎么理解模块化开发

所谓的模块化开发就是封装细节，提供使用接口，彼此之间互不影响，每个模块都是实现某一特定的功能。模块化开发的基础就是函数 二、为什么要通过模块化的方式进行开发？

1.高内聚低耦合，有利于团队作战，当项目很复杂的时候，将项目划分为子模块分给不同的人开发，最后再组合在一起，这样可以降低模块与模块之间的依赖关系体现低耦合，模块又有特定功能体现高内聚。
2.可重用，方便维护，模块的特点就是有特定功能，当两个项目都需要某种功能的时候，我们定义一个特定的模块来实现该功能，这样只需要在两个项目中都引入这个模块就能够实现该功能，不需要书写重复性的代码；并且当需求变更该功能需要改变的时候，我们直接修改该模块，这样就能够修改所有项目的功能，维护起来很方便。
3.模块化开发会引发大量的js被引入到页面，而这些模块之间还是有依赖关系，体现在引入的顺序，其实就是模块管理的问题，

七十四.什么是闭包，有什么作用？

七十五.transition transform translate 之间的区别 transform的属性有哪些？

translate:移动（transform的一个方法）

translate() 方法： translate(50px, 100px);//根据给定的 left（x 坐标） 和 top（y 坐标），元素从其当前位置移动

transform:变形：

CSS3中主要包括 1）旋转：rotate() 顺时针旋转给定的角度，允许负值 rotate(30deg) 2）扭曲：skew() 元素翻转给定的角度,根据给定的水平线（X 轴）和垂直线（Y 轴）参数：3）skew(30deg,20deg) 4）缩放：scale() 放大或缩小，根据给定的宽度（X 轴）和高度（Y 轴）参数： scale(2,4) 5）移动：translate() 平移，传进 x,y值，代表沿x轴和y轴平移的距离 6）所有的2D转换方法组合在一起： matrix(scale.x ,, , scale.y , translate.x, translate.y) // matrix() 旋转、缩放、移动以及倾斜元素 改变起点位置 transform-origin: bottom left;

综合起来使用：transform: 30deg 1.5 30deg 20deg 100px 200px;

transition: 允许CSS属性值在一定的时间区间内平滑的过渡， 需要事件的触发，例如单击、获取焦点、失去焦点等 transition:property duration timing-function delay;

property:CSS的属性，例如：width height 为none时停止所有的运动，可以为
duration:持续时间
timing-function:ease等
delay:延迟

76.css3中的选择器

77.html5新特性 css3 78.定时器 settimeout和setinterval的区别，如果用settimeout实现每隔一定的时间就执行一次，怎么实现

七十九.bookstrap栅格系统，你怎么理解栅格系统

八十.localstorage和sessionstorage的区别

1、localStorage和sessionStorage一样都是用来存储客户端临时信息的对象。
2、他们均只能存储字符串类型的对象（虽然规范中可以存储其他原生类型的对象，但是目前为止没有浏览器对其进行实现）。
3、localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。
4、sessionStorage生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭了，那么所有通过sessionStorage存储的数据也就被清空了。

拓展更多面试题（100道前端面试题练手）：

1、 2、 3、 4、 5、 6、 7、 8、 9、