2018-03-11

第一周：

1. 接触react，从基本语法到简单todolist，到使用dva+antd具体项目。
   基本流程就是 view -> models -> service 从而请求后台服务器
   体会到了 页面和业务逻辑以及请求到数据分离的清爽
   一周只写了两个界面就赶上功能上线。
   由于写的太少，没有文档支撑尤其是字段上，小bug以及边界值处理上还是差很多。。and在面对页面报错时，定位能力有点弱。
   编码上的小坑有很多，有空在写。。
   通过简单粗暴的理解react部分常用概念。
2. 重新复习并使用github并配置ssh 放弃http协议的push，一定要谨慎的避免提交错分支导致系统崩溃的事故出现。

3. 复习javascrpit的大部分api，
   包括对象，数组。DOM，BOM。以及其他数据类型对应的属性方法等。分别用一个例子来加深记忆，提高编码效率，选取最直接的方式。
4. 接触node写爬虫 一些基础模块的引入
   包括request发送请求，cherrio解析页面
   最后在promise下 实现了顺序下载的任务

总结：以前学的经过半年不怎么练手，很多知识点忘的的确很快。包括最常见的闭包解决(只知道解决办法是很不足的) 以及 promise使用(简单语法是满足不了实际场景的)。（todo）

---

1.react组件的定义

无状态函数，仅可访问传入的props，不进行实例化
不分配内存 => 性能提升
无法访问组件的this
无法访问生命周期
createClass
自动绑定this => 增加性能开销
class xxx extends React.Component 实例化且需要手动绑定this
在构造函数
constructor中 this.method = this.method.bind(this)
onclick中
onClick = {this.method.bind(this)} => bind
onClick = {() => this.method()} => arrow function
在不使用mixins 时 ，如果需要实例化则使用 第三者。。 不需要则使用函数式

2. 组件间的交互

父 => 子 props 可多层传递
父 => 子 跨层传递 Context
父组件中 getChildContext(){ return {} }
父组件外声明 xxx.childContextTypes = { prop: PropTypes.string }
子组件内 { this.context.prop }
子组件外声明 yyy.contextTypes = { prop: PropTypes.string }
子 => 父
父组件提供方法 methodName = { this.method }
子组件使用方法 this.props.methodName() => 将需要传递的数据，利用参数传递
兄 => 弟 使用pubsub.js库
publish 和 subscribe 进行发布和订阅
3.接触dva

model概念 一个领域的模型管理
同步更新state的reducers
处理异步逻辑的effects
订阅数据源的subscriptions
export default {

namespace: '',
state: [],
reducers: {},
effects: {
*method( { payload, callback }, {put, call} ){ yield 语法} => call 异步调用 put 触发action
}
}
错误处理
onError(e.dispatch)

---

actionTypeText: {
1: '打开房间',
2: '打开链接(URL)',
}[item.actionType]

JSX(todo more)

动态渲染组件时，使用JSX很舒服，但个人还是不习惯将js代码插到html中

渲染数组使用arr.map((item)=>{return (HTML)})

条件表达式代替if渲染 bool ? (HTML) : (HTML) [若要使用if，在return渲染前 用if 将HTML赋值给字符串]

条件多时 {str1:(HTML),str2:(HTML),str3:(HTML)}[str]

---