1.ES6新特性
let const 对象字面量写法 for…of循环 … 箭头函数
async/await是基于Promise实现的,它不能用于普通的回调函数。
async/await与Promise一样,是非阻塞的。
async/await使得异步代码看起来像同步代码,这正是它的魔力所在。
2.axios特性
请求只有两种:XMLHttpRequest, fetch
fetch是原生js的封装,基于标准 Promise 实现,支持 async/await
axios特性是:
防止CSRF:就是让你的每个请求都带一个从cookie中拿到的key, 根据浏览器同源策略,假冒的 网站是拿不到你cookie中得key的,这样,后台就可以轻松辨别出这个请求是否是用户在假冒网站上的误导输入,从而采取正确的策略
axios既提供了并发的封装,也没有fetch的各种问题,而且体积也较小,当之无愧现在最应该选用的请求的方式。
3.React16新特性
render支持数组和字符串
错误边界(Error Boundaries):错误边界是能够捕获子组件的错误并对其做优雅处理的组件,优雅处理可以根据你的需求来设计
自定义的DOM属性
setState传入null时不会再触发更新
React.lazy():可进行代码分割,代码分割是允许我们去延迟加载我们的import,意味着我们在渲染当前页面的时候去提升当前页面的性能,提高渲染速度。
Suspense:如果OtherComponent没有被加载成功,我可以通过使用Suspense这个组件的参数fallback参数来显示一些类似于加载中的提示内容
1 React16新的生命周期弃用了componentWillMount、componentWillReceivePorps,componentWillUpdate
新增了getDerivedStateFromProps、getSnapshotBeforeUpdate来代替弃用的三个钩子函数(componentWillMount、componentWillReceivePorps,componentWillUpdate)
2 React16并没有删除这三个钩子函数,但是不能和新增的钩子函数(getDerivedStateFromProps、getSnapshotBeforeUpdate)混用,React17将会删除componentWillMount、componentWillReceivePorps,componentWillUpdate
3新增了对错误的处理(componentDidCatch)
4.webpack打包优化
分包:配置webpack.config.js
使用cdn
5.React高阶组件(接收一个组件并返回另外一个新组件的函数,例如redux的connect)
高阶组件其实是一个函数,接收一个组件作为参数,返回一个包装组件作为返回值,类似于高阶函数
react 生命周期:实例 - 存在 - 销毁
实例期:getDefaultProps getInitialState componentWillMount render componentDidmount
存在期:componentWillResiveProps componentWillUpdate componentDidUpdate
销毁期:componmentWillUnmount
状态state改变触发:shouldComponentUpdate componentWillUpdate render componentDidUpdate
属性props改变:componentWillReserveProps shouldComponentUpdate componentWillUpdate render componentDidUpdate
- iframe跨域
子域中无法获取父域的数据的时候就可以利用document.domain都设置成相同的域名就可以完成
7.数据类型(详情见https://www.cnblogs.com/c2016c/articles/9328725.html)
分为值类型和引用类型
基本类型:null undefined boolean number string Symbol
引用类型:object array function
判别数据类型方式:typeof instanceof constructor prototype $.type()/jquery.type() (
详情见https://www.cnblogs.com/dushao/p/5999563.html )
instanceof 运算符是用来测试一个对象是否在其原型链原型构造函数的属性,其语法是object instanceof constructor
prototype用法:Object.prototype.toString.call(‘11’) == ‘[object String]’ true
jquery.type()用法:jQuery.type( undefined ) === “undefined” true
拷贝分为深度拷贝和浅度拷贝
深度拷贝:用递归的方法,把父对象中所有属于对象的属性类型都遍历赋给子对象即可
浅度拷贝:当被拷贝的值为基本类型时,传递的是该数据段,所以拷贝出来的东西无论拷贝多少个都指向父对象的拷贝对象的内存空间
//ES6实现浅拷贝的方法
var a = {name:“暖风”}
var b= Object.assign({},a);
b.age = 18;
console.log(a.age);//undefined
----------------------------------
//数组
var a = [1,2,3];
var b = a.slice();
b.push(4);
b//1,2,3,4
a//1,2,4
----------------------------------
var a = [1,2,3];
var b = a.concat();
b.push(4);
b//1,2,3,4
a//1,2,4
----------------------------------
var a = [1,2,3];
var b = […a]
b//1,2,3,4
a//1,2,4
8.react-router怎么实现路由切换
匹配url,以及对应的函数映射,即执行对应的代码。有标签,对象,按需加载的配置方式