underscore.js

在做本地缓存视频管理的时候，需要对数组进行大量的操作，本来React Native 有lodash工具库，旁边的前端同事使用的是underscore,大神在边上我就使用了underscore,其实api和lodash差不多，只是lodash更加完善，简单的处理underscore也足够。

直接下载underscore-min.js

1

import _ from './path/underscore-min';

下面是我主要用到的Api:

1. map方法遍历数组或对象，将返回的结果组成一个新的数组或对象

1
2
3
4
5
6
7
8
9
10
11
12

let data = _.map([1,2,3],function(n){ retrun n*2; })
//data = [2,4,6]
let data = _map([{name:'james'},{name:'jakson'},{name:'tom'}],function(item){
  return {
    name:item.name,
    isChecked:true
  }
})
//data = [{name:'james',isChecked:true},
//{name:'jakson',isChecked:true},
//  {name:'tom',isChecked:true}]

1. filter返回结果为true的成员

1
2

let data = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
//data = [2,4,6]

1. reject返回操作结果为false的成员

1
2

let data = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
//data = [2,4,6]

1. difference

1
2

let data = _.difference([1,2,3,5], [2,3,6,7,8])
//data=[1,5]  只保留[1,2,3,5]中不相同的

1. uniq

1
2
3
4
5
6
7
8
9

_.uniq(array, [isSorted], [iteratee])

let data = _uniq([1,2,3,4,3])
//data=[1,2,3,4]

let data= _uniq([{id:1,name:'bob'},{id:2,name:'jane'},{id:3,name:'jack'},{id:1,name:'bob'}],false,(item)=>{
  return item.id
})
//data=[{id:1,name:'bob'},{id:2,name:'jane'},{id:3,name:'jack'}]

1. indexOf

1
2

_.indexOf([1, 2, 3], 2);
//1,

1. contains

1
2
3

_.contains(list, value, [fromIndex])

//可以用includes

1. compact返回一个除去所有false值的 array副本。

   在javascript中, false, null, 0, “”, undefined 和 NaN 都是false值.

1
2

_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]

更多Api参考文档http://www.css88.com/doc/underscore/

React Native 触摸事件

响应事件：

• View.props.onStartShouldSetResponder
• View.props.onMoveShouldSetResponder

两个属性的回调函数里返回true表示响应事件，组件成为事件的处理者会走回调

• View.props.onResponderGrant: (evt) => {}

  被拒绝成为处理者，执行回调：

• View.props.onResponderReject: (evt) => {}

组件处理触摸事件的回调：

• View.props.onResponderStart: (evt) => {}

• View.props.onResponderMove: (evt) => {}

• View.props.onResponderRelease: (evt) => {}

• View.props.onResponderEnd: (evt) => {}

  是否释放事件处理权限

• View.props.onResponderTerminationRequest: (evt) => bool

• View.props.onResponderTerminate: (evt) => {}

多个组件嵌套响应事件：

如果多个父子组件都onStartShouldSetResponder返回true,那么最内层的子组件会最先响应，这是所谓的事件处理的冒泡机制，当然层层深入到子组件首先得得到父组件的同意：

• View.props.onStartShouldSetResponderCapture
• View.props.onMoveShouldSetResponderCapture

回调返回true表示该组件捕获了该事件，那么子组件就无法成为事件响应者了

React Native 手势识别系统PanResponder

panresponder对触摸事件进行了封装提供的API让我们可以更方便的使用手势识别功能

• onStartShouldSetPanResponder: (e, gestureState) => bool
• onStartShouldSetPanResponderCapture: (e, gestureState) => bool
• onMoveShouldSetPanResponder: (e, gestureState) => bool
• onMoveShouldSetPanResponderCapture: (e, gestureState) => bool
• onPanResponderGrant: (e, gestureState) => {…}
• onPanResponderStart: (e, gestureState) => {…}
• onPanResponderMove: (e, gestureState) => {…}
• onPanResponderRelease: (e, gestureState) => {…}
• onPanResponderTerminationRequest: (e, gestureState) => {…}
• onPanResponderTerminate: (e, gestureState) => {…}
• onShouldBlockNativeResponder: (e, gestureState) => bool

在最近的项目里要实现parallax的scrollview头部图像拉伸效果,GitHub上搜索后发现有实现的库，那好啊npm install —save简单粗暴，咔咔import结果Android手机分分钟没效果，遂弃之，决定自己实现一个，这里面就用到了手势识别，结合动画下拉伸缩图片，scrollview和外别view手势识别冲突的拦截等。

第一个React Native应用BetterThan终于上线了,是一款健身健康类应用,Android,iOS里面涉及到很多各自平台的原生技术点,因为React Native 主要是做UI相关,而很多东西需要原生实现别如：第三方登录分享,推送通知,视频录制播放等,所以说不是纯ReactNative应用,应用的第一个版本包含了直播,社交圈子和我的个人信息三部分,目前来看只能算作测试版本先行试水,接下来会迭代新的模块和继续填坑。

Android版本下载：

Mac下Linux实现shift+pageup/pagedown 翻页

1

shift+fn+up/down

查看Linux 服务器地址

1

ip addr

Mac终端连接Linux

1

ssh username@ipaddress

redis安装后后台运行服务

1

src/redis-server &

启动客户端

1

src/redis-cli

关闭服务

1

shutdown

[redis安装参考]（http://itbilu.com/database/redis/4kB2ninp.html）

redis

Redis 是一个开源（BSD许可）的，内存中的数据结构存储系统，它可以用作数据库、缓存和消息中间件。

save（存储）

set name redis

get（获取）

get name

del（删除）

del name

inrc（自增加一）

1
2
3
4

set number 10
incr number => 11
del number
incr number =>1

expire(存储时间)

expire name 120

ttl(查看剩余时间)

ttl name =>108

被删除后会输出-2，如果输出-1表示永不过期，如果重新set name value,ttl也会被reset

rpush(list末尾添加)

1
2

rpush friends "Jack"
rpush friends "Rose"

lpush(list头部添加)

1

lpush friends "Jesus"

lrange(获取list)

1
2
3
4
5
6

lrange friends 0 -1 =>
1) "Jesus"
2) "Jack"
3) "Rose"
lrange friends 0 1
lrange friends 1 2

-1表示取到list的最后一位

llen(获取list长度)

llen friends => 3

lpop(移除list第一个)

lpop friends =>"Jesus"

rpop(移除list最后一个)

rpop friends

sadd(给set添加数据)

1
2
3
4

sadd heroes "Iron Man"
sadd heroes "Transformers"
sadd heroes "Spider Man"
sadd heroes "Ant Man"

srem(从set移除数据)

srem heroes "Transfromers"

sismember(set中是否包含)

1
2

sismember heroes "Iron Man" => 1
sismember heroes "Flash Man" => 0

0表示不存在，1表示不存在

smembers(获取set所有值)

1

smembers heroes

sunion(合并set)

1
2
3

sadd beauties "Sophie"
sadd beauties "Sheeba"
sunion heroes beauties =>

Sorted Sets

1
2
3
4
5

zadd ranks 3 "Python"
zadd ranks 2 "Java"
zadd ranks 4 "Ruby"
zadd ranks 1 "JavaScript"
zadd ranks 5 "Php"

sorted sets多了一个sorce,根据score排序

zragne

1
2
3
4

zrange ranks 1 3 =>
1) "Java"
2) "Python"
3) "Ruby"

hset(存储对象)

1
2
3

hset user name "Jack"
hset user email "jack@gmail.com"
hset user password "rose"

hgetall(获取对象所有信息)

1
2
3
4
5
6
7

hgetall user =>
1) "name"
2) "Jack"
3) "email"
4) "jack@gmail.com"
5) "password"
6) "rose"

hmset(一次设置多个字段)

1

hmset user:002 name "Hodor" password "holdthedoor" email "hodor@gmail.com"

hget(获取单个字段)

1

hget user:002 name

1
2
3
4
5

HSET user:002 waittime 1000
HINCRBY user:002 waittime 1 => 1001
HINCRBY user:002 waittime 10 => 1011
HDEL user:002 waittime
HINCRBY user:002 waittime 1 => 1