289页初中级前端题助你拿下Offer，赶紧收藏备战金三银四

6.ID 选择器           权重100
7.内联样式            权重1000 !important规则会覆盖任何其他的声明，只在需要覆盖全站或外部CSS的替丁页面中使用。

11、CSS配置的常用属性有哪些及作用？

分类	属性	值
宽和高	width 宽度；height 高；max-height 跟着父标签
字体属性	color 颜色；font-family 字体；font-size 文字大小；font-weight 文字粗细	normal 默认值 bold 粗体 bolder 更粗 lighter 更细 100~900 具体粗细 inherit 继承类元素字体的粗细值
颜色	十六进制值: #FF0000; 单词表示: blue，red; RGB值: (255, 0, 0);rgba(200, 0, 0, 0.3)
文字属性	text-align，text-decoration, text-indent 段落缩进32像素	left 左边对齐 right 右对齐 center 居中对齐 justify 两端对齐; none 默认 underline 文本下一条线 overline 文本上一条线 line-through 穿过文本一条线 inherit 继承父类属性
背景属性	背景颜色background-color: red; 背景图片background-image: url(‘1.jpg’);背景重复 background-repeat: repeat; 背景位置 background-position: right top
CSS盒子	margin 控制元素与元素之间的距离;padding 控制内容与边框之间的距离; border 内边距和内容外的边框; content 内容,显示文本和图像;	简写顺序：上 右 下 左
边框	border-width, border-style, border-color;可以简写为border:2px solid red;	border-radius 实现圆角边框；border-style的值有none 无边框 dotted 点状虚线边框 dashed 矩形虚线边框 solid 实现边
显示	display	none 不显示；block 沾满整个页面宽度；inline 显示为内联元素；inline-block 具有内元素和块级元素
浮动	float 任何元素都可以浮动；clear属性指定侧不允许其他浮动元素；	float的属性：left 向左，right 向右，none 不浮动。clear属性left在左侧不允许浮动元素，right在右侧不允许浮动元素，both左右两侧不允许，none 允许出现；inherit 继承父元素；
溢出	overflow	visible 内容不会被修剪，hidden 内容被修剪并其余内容不可见，scroll内容被修剪并显示滚动条可查看其余的内容，auto内容被修剪并显示滚动条可查看其余的内容，inherit从父元素继承
定位	position	static 无定位，relative 相对定位，absolute 绝对定位，fixed 固定

12、bwebpack的作用及怎么使用？

模块打包机，分析项目结构，找到JavaScript模块以及一些浏览器不能直接运行的扩展语言(Scss, TypeScript等)，并将其打包为合适的格式以浏览器使用。 通过css-loader和style-loader将样式表表嵌入webpack打包后的JS文件中。

通过less-loader, sass-loader,stylus-loader进行CSS预处理器可以把特殊类型的语句转化为浏览器可识别的CSS语句。

webpack使用插件来扩展webpack功能并在整个构建过程中生效和执行相关任务。如HtmlWebpackPlugin插件，依据一个简单的模板生成最终的Html5文件并在文件中自动引用了打包后的JS文件。

13、Promise实现及优缺点

Promise用于表示一个异步操作的最终完成（或失败）及其结果值。

var myPromise = new Promise((resolve, reject) => {
  // 需要执行的代码
  ...
  if (/* 异步执行成功 */) {
    resolve(value)
  } else if (/* 异步执行失败 */) {
    reject(error)
  }
})

myPromise.then((value) => {
  // 成功后调用, 使用value值
}, (error) => {
  // 失败后调用, 获取错误信息error
})

优点：
解决回调地狱，对异步任务写法更标准化与简洁化。

缺点：首先无法取消Promise，一旦新建它就会立即执行，无法中途取消。其次，如果不设置回调函数，Promise内部抛出错误，不会反应到外部。

第三，当处于pending状态时，无法得知目前进展到哪一个阶段。

14、Http状态码及含义

1xx: 服务器收到请求, 需请求者进一步操作
2xx: 请求成功
3xx: 重定向, 资源被转移到其他URL了
4xx: 客户端错误, 请求语法错误或没有找到相应资源
5xx: 服务端错误, server error
301: 资源(网页等)被永久转移到其他URL, 返回值中包含新的URL, 浏览器会自动定向到新URL
302: 临时转移. 客户端应访问原有URL
304: Not Modified. 指定日期后未修改, 不返回资源
403: 服务器拒绝执行请求
404: 请求的资源(网页等)不存在
500: 内部服务器错误

15、async和await的使用

async/await是写异步代码的新方式，以前的方法有回调函数和Promise。
async/await是基于Promise实现的，它不能用于普通的回调函数。
async/await与Promise一样，是非阻塞的。
async/await使得异步代码看起来像同步代码，这正是它的魔力所在。

16、setTimeout时间延迟为何不准

单线程，先执行同步主线程，再执行异步任务队列。

17、let const var作用域及区别

块级作用域，暂时性死区。
var 定义的变量，可以跨块作用域访问，不能跨函数作用域访问。

let 定义的变量，只能在块作用域里访问，不能跨块作用域访问也不能跨函数作用域访问。

const 定义常量，创建时必须赋值，只能在块作用域里访问并且不能修改。

18、for in, forEach和for of的区别

for in遍历数组会遍历到数组原型上的属性和方法，更适合遍历对象。遍历到myObject的原型方法method，如果不想遍历原型方法和属性的话，可以在循环内部判断一下hasOwnProperty方法可以判断某属性是否是该对象的实例属性。

forEach不支持break，continue，return等

for of可以成功遍历数组的值，而不是索引，不会遍历原型。

19、localStorage 与 sessionStorage 与cookie的区别总结

共同点： 都保存在浏览器端且同源。

localStorage，sessionStorage统称为webStorage，保存在浏览器，不参与服务器通信。大小为5M。

生命周期不同：localStorage永久保存，sessionStorage当前会话。都可以手动删除。

作用域不同： 不同浏览器不共享local和session，不同会话不共享session。

Cookie：设置的过期时间前一直有效，大小4K。有个数限制，各浏览器不同，一般为20个。携带在http头中，过多会有性能问题。可自己封装，也可用原生。

20、微信小程序组件的生命周期？

onLoad页面加载：一个页面只会调用一次，可以在onLoad中获取打开当前页面所调用的query参数。

onShow 页面显示：每次打开页面都会调用一次。

onReady 页面初次渲染完成：一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。

onHide 页面隐藏：当navigateTo或底部tab切换时调用。

onUnload 页面卸载： 当页面摧毁时执行。

21、微信小程序原理？

微信小程序采用JavaScript，WXML，WXSS三种技术进行开发。

JavaScript：首先JavaScript的代码是运行在微信App中的，并不是运行在浏览器中，因此一些H5技术的应用，需要微信App提供对应的API支持，而这限制住了H5技术的应用，切不能称为严格的H5.同理，微信提供的独有的某些API，H5也不支持或支持的不是特别好。

WXML： WXML微信基于XML语法开发的，因此开发时，只能使用微信提供的现有标签，HTML的标签是无法使用的。

WXSS：具有CSS的大部分特性，但并不是所有的都支持，而且支持哪些，不支持哪些并没有详细的文档。 微信的架构是数据驱动的架构模式，UI和数据是分离的，所有的页面更新都需要通过对数据的更改来实现。 微信程序分为两个部分webview和appService。其中webview主要用来展现UI，appService有来处理业务逻辑、数据及接口调用。他们在两个进程中运行，通过系统层JSBridge实现通信，实现UI的渲染、事件的处理。

22、HTTP状态码及其含义

状态码类型状态码	类别	原因短语
1XX	Information（信息性状态码）	接收的请求正在处理
2XX	Success（成功状态码）	请求正常处理完毕
3XX	Redirection（重定向状态码）	需要进行附加的操作以完成请求
4XX	Client Error（客户端错误状态码）	服务器无法处理请求
5XX	Server Error（服务端错误状态码）	服务器处理请求出错
204		服务器成功处理，但未返回内容。
304	Not Modified 未修改。	所请求的资源未修改，服务器返回此状态码时，不会返回任何资源。客户端通常会缓存访问过的资源，通过提供一个头信息指出客户端希望只返回在指定日期之后修改的资源
400	Bad Request	客户端请求的语法错误，服务器无法理解
403	Forbidden	服务器理解请求客户端的请求，但是拒绝执行此请求
404	Not Found	服务器无法根据客户端的请求找到资源（网页）。

通过此代码，网站设计人员可设置"您所请求的资源无法找到"的个性页面
quest| 客户端请求的语法错误，服务器无法理解|
|403|Forbidden| 服务器理解请求客户端的请求，但是拒绝执行此请求|
|404|Not Found |服务器无法根据客户端的请求找到资源（网页）。|

通过此代码，网站设计人员可设置"您所请求的资源无法找到"的个性页面