In this tutorial we're going to build a set of parser combinators.
We'll answer the above question in 2 steps.
- What is a parser?
- and, what is a parser combinator?
So first question: What is parser?
| import {render} from 'react-dom'; | |
| import React, {Component, Children, cloneElement} from 'react'; | |
| class CurrentTime extends Component { | |
| state = {time: ''}; | |
| componentDidMount() { | |
| this._interval = setInterval(() => this.setState({time: this.getTime()}), 50); | |
| } | |
| componentWillUnmount() { | |
| clearInterval(this._interval); |
Compile with:
webpack --config vendor.webpack.config.js
webpack --config app.webpack.config.jsUse with the following index.html
| const curry = fn => (...args1) => { | |
| if (args1.length === fn.length) { | |
| return fn(...args1); | |
| } | |
| return (...args2) => { | |
| const args = [...args1, ...args2]; | |
| if (args.length >= fn.length) { | |
| return fn(...args); |
| sudo rm -fr /Library/Java/JavaVirtualMachines/jdk-9.jdk/ | |
| sudo rm -fr /Library/Internet\ Plug-Ins/JavaAppletPlugin.plugin | |
| sudo rm -fr /Library/PreferencePanes/JavaControlPanel.prefPane | |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <style> | |
| .noscroll { | |
| overflow: hidden; | |
| } |
| (function() { | |
| var start = null; | |
| var scrollPosition = window.scrollY; | |
| var halfWindowHeight = window.innerHeight / 2; | |
| var rAFstarted = false; | |
| var scrollnimates = [].slice.call(document.getElementsByClassName('scrollnimate')); | |
| // get their offset from top of screen and their scroll speed | |
| scrollnimates.forEach( function ( sn ) { |
| { | |
| "keys": ["tab"], | |
| "command": "expand_abbreviation_by_tab", | |
| // put comma-separated syntax selectors for which | |
| // you want to expandEmmet abbreviations into "operand" key | |
| // instead of SCOPE_SELECTOR. | |
| // Examples: source.js, text.html - source | |
| "context": [ | |
| { |
| /* bling.js */ | |
| window.$ = document.querySelector.bind(document); | |
| window.$$ = document.querySelectorAll.bind(document); | |
| Node.prototype.on = window.on = function(name, fn) { this.addEventListener(name, fn); }; | |
| NodeList.prototype.__proto__ = Array.prototype; | |
| NodeList.prototype.on = function(name, fn) { this.forEach((elem) => elem.on(name, fn)); }; |
| import { Component } from "React"; | |
| export var Enhance = ComposedComponent => class extends Component { | |
| constructor() { | |
| this.state = { data: null }; | |
| } | |
| componentDidMount() { | |
| this.setState({ data: 'Hello' }); | |
| } | |
| render() { |