前端总结

1、rem与em区别

长度单位，em 的计算是基于父级元素的，rem始终是基于根元素（html） 的。

2、响应式设计方法

(1) 使用流体布局方式

(2) 设置meta标签

<meta name="viewport" content="width=device-width,initial-scale=1,max-scale=1">

(3) 使用媒体查询选取不同CSS样式，media查询

(4) 宽度使用百分比，使用min-width、max-width

(5) 字体大小使用rem

3、与服务器交互

分类：get、post、delete、put

get与post区别：

（1）get请求参数在url，post请求参数在body体中；

（2）get请求用于从后台获取数据，post请求可向后台传送数据；

（3）post请求比get请求更安全，get请求可能被浏览器缓存，泄露用户名密码等；

4、ajxs请求步骤

（1）创建XMLHTTPRequest的对象，let request = new XMLHTTPRequest();

（2）创建http请求，request.open(method,url,flag);

（3）设置http请求的状态响应函数onreadystatechange

        readyState的各个状态：①未初始化状态。②初始化状态。③发送数据状态。④接收数据状态。⑤完成状态。

（4）发送http请求，request.send(data)。

5、居中

（1）已知宽高

.classCenter{
    width: 100px;
    height: 100px;
    position:absolute;
    left:50%;
    right:50%;
    margin-left:-50px;
    margin-top:-50px;
}

（2）未知宽高

.classFlexCenter{
    display:flex;
    align-items:center;
    justify-content:center;
}

6、JSON与JSONP

JSON是数据格式，JSONP是跨域的手段，全名叫做json with padding，很形象，就是把json对象用符合js语法的形式包裹起来以使其它网站可以请求得到，也就是将json数据封装成js文件

7、webpack工具开发时，你常用哪些loader

 

• babelLoader，转义ES6/ES7的语法， 转义react
• style-loader : 将css模块作为样式导入JSX文件
• cssLoader， 引入模块化CSS，加上独一无二的hash值
• react-hot-loader : 动态刷新和转义react组件中修改的部分,基于webpack-dev-server插件需先安装,然后在webpack.config.js中引用react-hot-loader
• urlLoader， fileLoader ： 防止超过大小限制的图片无法生成到目标文件夹中 

参考：这里

8、js判断一个对象为数组

function checkIsArray(arr) {
    return Object.prototype.toString.call(arr) == "[object Array]" && arr instanceof Array && "push" in arr;
}