Well, this stuff will be a little bit strange if you deal with it first time.

Container Object:

  •   Just a wrapper / contianer for values
  •   No Method
  • No Nouns
var _Container = function(val){
this.val = val;
} var Container = function(x){
return new _Container(x);
} console.log(Container()) // _Container( {val: 3})

Every time we use Container, it will just add the value to the Container object and assign value to prop val.

map function on Container:

This map is not the map what you think it is....

The map you think is the method on the Array.

Here the map is the one get into the Container, grep the value, then apply function on this value. The return value is still Container.

_Container.prototype.map = function(f){
return Container(f(this.val))
}
var res = Container("flamethrower").map(function(s){ return _.capitalize(s) })
console.log(res) //_Container( {val: "Flamethrower"} )

So in the example, map function goes into the Container, get the value "flamethrower", and apply the function '_.capitialize' to the value and return the new value to the Container.

Or you can write like this:

var capitalize = _.capitalize;
var res = Container("flamethrower").map(capitalize);

More examples:

Container([,,]).map(reverse).map(first)
//=> Container(3) Container("flamethrower").map(length).map(add())
//=> Container(13)

So "Container"... what you feel about it? It is nothing... you don't need to care about it. Just every time you call map on it, the return value will still inside the Container, so that you can chain map on it.

Curry map:

Define a global map function, which use Ramda curry method:

var map = R.curry(function(f, obj) {
return obj.map(f)
})

Later we will pass Container as obj, and on our Container, we already defined map function, so we can use here as 'obj.map'.

So, again, here 'obj.map' --> Means, goes into the obj, grep the value and apply function f.

So now what we can do:

Container().map(add()) // Container(4)

map(add(), Container()) // Container(4), or map(add(1))(Container(3)), since map is curry method

More exmaples:

map(R.compose(R.head, R.reverse), Container("dog"))
//=> Container(“g”)

So all what we have seen so far, we give a name call "Functor".

Functor

“An object or data structure you can map over”

function: map

// Exercise 1
// ==========
// Use _.add(x,y) and map(f,x) to make a function that increments a value inside a functor
console.log("--------Start exercise 1--------")
//map(): Go inside the object and run the function on the value of the object
//map(): Here map is curry function, so take the function as first arguement and object as second arguement.
//map(_.add(1), Identity(2)) --> Identity(3)
var ex1 = map(_.add()); assertDeepEqual(Identity(), ex1(Identity()))
console.log("exercise 1...ok!") // Exercise 2
// ==========
// Use _.head to get the first element of the list
var xs = Identity(['do', 'ray', 'me', 'fa', 'so', 'la', 'ti', 'do'])
console.log("--------Start exercise 2--------") var ex2 = map(_.head) assertDeepEqual(Identity('do'), ex2(xs))
console.log("exercise 2...ok!")

[Javascript] Functor Basic Intro的更多相关文章

  1. [Javascript] Functor law

    Functor laws: 1. Identity: map(id) == id 2. Composition: compose(map(f), map(g)) == map(compose(f,g) ...

  2. 浅析Javascript

    Javascript是一种脚本语言,从出生就被唾弃,一开始人们使用它只是为了解决诸如页面数据校验之类的问题.它基于prototype的面向对象实现一度被认为很丑很难用,甚至很多身处一线Web开发者都不 ...

  3. JavaScript Web Application summary

    Widget/ HTML DOM (CORE) (local dom) DOM, BOM, Event(Framework, UI, Widget) function(closure) DATA (c ...

  4. 跨域资源共享(CORS)问题解决方案

    CORS:Cross-Origin Resource Sharing(跨域资源共享) CORS被浏览器支持的版本情况如下:Chrome 3+.IE 8+.Firefox 3.5+.Opera 12+. ...

  5. svg-高斯模糊+swiper伦播

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 使用 libevent 和 libev 提高网络应用性能

    使用 libevent 和 libev 提高网络应用性能 Martin C. Brown, 作家, Freelance 简介: 构建现代的服务器应用程序需要以某种方法同时接收数百.数千甚至数万个事件, ...

  7. 模态框zeroModal快速引入

    最基本快速接入 <%@ page language="java" contentType="text/html; charset=UTF-8" pageE ...

  8. Js-函数式编程

    前言 JavaScript是一门多范式语言,即可使用OOP(面向对象),也可以使用FP(函数式),由于笔者最近在学习React相关的技术栈,想进一步深入了解其思想,所以学习了一些FP相关的知识点,本文 ...

  9. JS代码风格自动规整工具Prettier

    问题背景 通常使用 ESLint做代码风格检查检查, 和部分代码质量检查. 但是使用ESLint在入库时候, 会产生很多的代码修正工作, 需要开发者一个一个的修改. 如果很多,并且时间紧迫,甚是尴尬. ...

随机推荐

  1. Gedit中文乱码

    缺省配置下,用 Ubuntu 的文本编辑器(Gedit)打开GB18030(繁体中文用户请将这里的出现的GB18030替换成BIG5或BIG5-HKSCS)类型的中文编码文本文件时,将会出现乱码. 出 ...

  2. C#函数式编程之部分应用

    何谓函数式编程 相信大家在实际的开发中,很多情况下完成一个功能都需要借助多个类,那么我们这里的基本单元就是类.而函数式编程则更加细化,致使我们解决一个功能的基本单元是函数,而不是类,每个功能都是由多个 ...

  3. Lambda表达式的前世今生

    Lambda 表达式 早在 C# 1.0 时,C#中就引入了委托(delegate)类型的概念.通过使用这个类型,我们可以将函数作为参数进行传递.在某种意义上,委托可理解为一种托管的强类型的函数指针. ...

  4. Java面试题(1)

    1.编写一个程序,将d:\java 目录下的所有.java 文件复制到d:\jad 目录下,并将原来文件的扩展名从.java 改为.jad. import java.io.File; import j ...

  5. CSS设计资料

    CSS实现垂直居中的5种方法 网页阶级配色:http://tools.jb51.net/tools/peise.htm

  6. [自制简单操作系统] 2、鼠标及键盘中断处理事件[PIC\GDT\IDT\FIFO]

    1.大致介绍: >_<" 大致执行顺序是:ipl10.nas->asmhead.nas->bootpack.c PS: 这里bootpack.c要调用graphic. ...

  7. 使用grunt打包ueditor源代码

    支持版本支持 UEditor 1.3.0+ 的版本 使用方法1.线上下载ueditor下载地址:ueditor,要下载"完整版 + 源码" 2.安装nodejs下载nodejs并安 ...

  8. Atitit.实现继承的原理and方法java javascript .net c# php ...

    Atitit.实现继承的原理and方法java javascript .net c# php ... 1. 实现继承的问题 1 2. 如何拷贝基类方法?采用prototype原型方式,通过冒充对象 1 ...

  9. paip.简化字-手写参考二简字..共98个

    paip.简化字-手写参考二简字..共98个 作者Attilax 艾龙, EMAIL:1466519819@qq.com 来源:attilax的专栏 地址:http://blog.csdn.net/a ...

  10. iOS开发---集成百度地图完善版

    一.成为百度的开发者.创建应用 http://developer.baidu.com/map/index.php?title=首页 (鼠标移向 然后选择你的项目需要的功能 你可以在里面了解到你想要使用 ...