cosyer's Blog

Blog


  • 首页

  • 友链

  • 留言板

  • 归档

  • 关于

  • 搜索

redux 标签

5月
08
更新于
5月08
2020
JS

正则总结

发表于 2018-10-14 | 热度 ℃
| 字数统计: 3,817 (字) | 阅读时长: 15 (分钟)

正则表达式脱离语言,和数据结构与算法一样,作为程序员的软技能。目前存在的问题:不受重视 优点:

  • 显著的提升代码质量
  • 灵活多变
  • 强大的数据校验支持
1
2
3
4
var regex1 = /cosyer/g;
var regex2 = new RegExp('cosyer', 'g');
var regex3 = new RegExp(/cosyer/, 'g');
var regex4 = new RegExp(/cosyer/g);

其中的模式(pattern)部分可以是任何简单或复杂的正则表达式,可以包含字符类、限定符、分组、 向前查找以及反向引用。每个正则表达式都可带有一或多个标志(flags),用以标明正则表达式的行为。 正则表达式的匹配模式支持下列 3 个标志。

  • g:表示全局(global)模式,即模式将被应用于所有字符串,而非在发现第一个匹配项时立即停止;
  • i:表示不区分大小写(case-insensitive)模式,即在确定匹配项时忽略模式与字符串的大小写;
  • m:表示多行(multiline)模式,即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项。

新增的修饰符:

  • u: Unicode模式。用来处理Unicode大于 \uFFFF的单个字符(超过\uFFFF会被程序员解析为两个字符)
  • y: 粘连模式。和g一样作为全局匹配,区别是g的下一次匹配不要求位置,但是y下一次匹配要求紧跟这这次匹配项之后
  • s: dotAll模式。正则表达式中点(.)作为匹配(除换行符\n,回车符\r,行分隔符,段分隔符)任意单个字符,支持点(.)真正匹配所有单个字符

两种使用方式

1
2
var a1 = /\+d/g; // 字面形式
var a2 = new RegExp('\\+d','g') // 构造函数

在JavaScript中建议使用字面形式的正则表达式,因为不需要担心字符串中的转义字符。比如上面示例代码中字面形式使用\d而构造函数使用的是\d;

1
2
3
var text = "aaa "; 
var pattern1 = /\s$/; //匹配字符串末尾的空格
pattern1.exec(text);

阅读全文 »
7月
01
更新于
7月01
2020
JS

动手实现redux

发表于 2018-10-03 | 热度 ℃
| 字数统计: 741 (字) | 阅读时长: 4 (分钟)

概念:

  • 一个app只有一个store,一个store管理着一个全局state含有以下方法
    • getState: 获取 state;
    • dispatch: 触发 action, 更新 state;
    • subscribe: 订阅数据变更,注册监听器;
  • createStore 传入reducer,返回getState, dispatch, subscribe
  • action是一个至少有type这个键的对象,可以写一个creactAction 函数去return生成action对象
  • createStore.dispatch(action) 根据action这个对象去更新state
  • dispatch是一个函数,内部又将执行reducer函数
  • reducer也是一个函数,传入state,action, 输出一个新的state . (switch case return…)
    • 遵守数据不可变,不要去直接修改 state,而是返回出一个 新对象;
    • 默认情况下需要 返回原数据,避免数据被清空;
    • 最好设置 初始值,便于应用的初始化及数据稳定;

redux


阅读全文 »
6月
02
更新于
6月02
2020
JS

redux状态传播

发表于 2018-06-21 | 热度 ℃
| 字数统计: 1,168 (字) | 阅读时长: 5 (分钟)

Redux三大概念

Redux 是JavaScript状态容器,提供可预测化的状态管理

action 普通的JS对象描述发生什么

reducer 只是一个接收 state 和 action,并返回新的 state 的函数

Store — 数据存储中心,同时连接着Actions和Views(React Components)。

  1. Store需要负责接收Views传来的Action
  2. 然后,根据Action.type和Action.payload对Store里的数据进行修改
  3. 最后,Store还需要通知Views,数据有改变,Views便去获取最新的Store数据,通过setState进行重新渲染组件(re-render)。

三大原则

  1. 单一数据源

整个应用的 state 被储存在一棵 object tree 中,并且这个 object tree 只存在于唯一一个 store 中。和根级的reducer,拆成多个reducer而不是多个store。

  1. State 是只读的

唯一改变 state 的方法就是触发 action,action 是一个用于描述已发生事件的普通对象。

  1. 使用纯函数来执行修改

为了描述 action 如何改变 state tree ,你需要编写 reducers。传递数据 payload规范。

当 state 变化时需要返回全新的对象,而不是修改传入的参数。


阅读全文 »
陈宇(cosyer)

陈宇(cosyer)

不去做的话永远也做不到。

159 日志
10 分类
51 标签
RSS
GitHub Twitter E-Mail FB Page
推荐阅读
  • Callmesoul
  • JsTips
  • Personal Site
  • Resume
© 2021 陈宇(cosyer)
终于等到你(UV):   |   欢迎再来(PV):
Blog总字数: 312.5k字
苏ICP备17005342号-1