Live Note

Remain optimistic

What is currying

Currying is the technique of translating the evaluation of a function that takes multiple arguments into evaluating a sequence of functions, each with a single argument. -- Wikipedia
It mean this:

1
2
3
4
5
let add = (x) => (y) => x + y
let addOne = add(1)
let addTwo = add(2)
addOne(11) // 12
addTwo(11) // 13

In order to define functions more easily, we need the loadsh, it will help us to currying the function.

make some using thing

1
2
3
4
5
6
7
8
9
10
11
12
13
var _ = require("loadsh").curry

var match = _((regex, str) => str.match(regex))
var replace = _((regex, replacement, str) => str.replace(regex, replacement))
var filter = _((f, array) => array.filter(f))
match(/\s+/g, "test Message") // [' ']
match(/\s+/g)("test Message") // [' ']

var hasSpace = match(/\s+/g)
hasSpace("testMessage") // null
filter(hasSpace, ["testMessage1", "test Message2", "test Message 3"]) // ['test Message2', 'test Message 3']
var noA = replace(/[Aa]+/g, "*")
noA("aaaabbbAAAc") // '*bbb*c'
Read more »

TikTok

Function Composition

In computer science, function composition is an act or mechanism to combine simple functions to build more complicated ones. Like the usual composition of functions in mathematics, the result of each function is passed as the argument of the next, and the result of the last one is the result of the whole. -- Wikipedia

Example:

1
2
3
4
5
6
var compose = (f, g) => (x) => f(g(x))
var head = (x) => x[0]
var reverse = reduce((a, x) => [x].concat(a), [])

var last = compose(head, reverse)
last(["first", "second", "last"]) // 'last'

In the definition of compose, g will be executed before f, thus creating a right-to-left data stream. This is much more readable than nesting a bunch of function calls.

Associativity

Like many other functional programming concepts, associativity is derived from math.It is an expression in which the order of evaluation does not affect the end result provided the sequence of the operands does not get changed. -- JOSEPH REX

Example:

1
2
2 + (3 + 4) === 2 + 3 + 4 // true
2 * (3 * 4) === 2 * 3 * 4 // true

Because of the grouping of calls to compose is not important, so the result is the same. This also gives us the ability to write a variadic compose.
Like this:

1
2
3
4
5
6
7
8
9
10
var last = compose(head, reverse)
last(["first", "second", "last"]) // 'last'

var upperLast = compose(head, reverse, toUppercase)
upperLast(["first", "second", "last"]) // 'LAST'

var mediaUrl = _.compose(_.prop("m"), _.prop("media"))
// var images = _.compose(_.map(img), _.map(mediaUrl), _.prop('items'));
// use the associativity
var images = _.compose(_.map(_.compose(img, mediaUrl)), _.prop("items"))

There is no standard answer on how to composition, just make it more reusable.

Read more »

Time Picker Pnl in React Native

Why i write this component?
First, I found a lib called @react-native community/picker and wrote my code based on it. When I was done, it worked fine in ios, but when I turned on my android. Oh, my God, it’s not working. This component is platform based. It behaves differently on different platforms.

Then I found another library called react-native-picker, but it was too ugly and not customizable. My UI designer wouldn’t let me use this kind of thing, so I wrote my own component.

Note: This component is not perfect, but it works fine in my work. If you have any suggestion or issue, please let me know. You can build your own component based on this code.
If this code help you, please follow me on Github. XD(am greedy)

Requirements:

  • react-native-modal: pop up modal for time picker

Time Picker Pnl

Read more »

在 TypeScript 的类型系统中,Top Type(顶层类型)Bottom Type(底层类型) 是两个非常重要的概念。它们分别代表了类型范围的“最顶层”和“最底层”,理解它们对于掌握 TypeScript 的类型系统至关重要。

Read more »