ES6 拾遗(1)

Submitted by Lizhe on Wed, 06/20/2018 - 17:03

 

 

1. let const 不存在变量提升

2. let const 绑定到块级作用域

3. ES6 允许块级作用域无限叠加

4. ES5 中的函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域中声明

5. ES6 中明确允许在块级作用域之中声明函数. ES6规定, 在块级作用域之中声明的函数在块级作用域之外不可用(类似于let)

实际情况中为了兼容旧代码

允许在块级作用域内声明函数

声明类似var, 仍然会提升到全局作用域或函数作用域的头部

同时, 函数声明还会提升到所在的块级作用域的头部

考虑到环境导致的行为差异太大, 应该避免在块级作用域内声明函数.

如果确实需要, 也应该写成函数表达式的形式

 

函数声明语句

{

 

let a = “ message “;

function f() {

return a;

}

}

 

函数表达式

Nodejs IDE

Submitted by Lizhe on Wed, 06/20/2018 - 16:14

 

https://code.visualstudio.com/

https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

react-intl

Submitted by Lizhe on Thu, 06/14/2018 - 15:36

Internationalize React apps. This library provides React components and an API to format dates, numbers, and strings, including pluralization and handling translations.

react intl 用于格式化日期, 数字, 字符串多元化和翻译(实际上可以用做国际化)

安装

$ npm install react-intl --save

 

 

Formik 总结

Submitted by Lizhe on Thu, 06/14/2018 - 09:44

以下内容总结自Formik的官方文档, 所以你会看到一些原文引用(当然是我过滤后的)

Overview

Formik 总的来说帮助我们做下面3件事

  1. Getting values in and out of form state
  2. Validation and error messages
  3. Handling form submission

 

Why not Redux-Form?

总的来说, redux form提供的东西太重了, 过多的reducer, 而且通常情况下我的Form值并不需要保存在redux的state中

My goal with Formik was to create a scalable, performant, form helper with a minimal API that does the really really annoying stuff and leaves the rest up to you.

 

Formik 使用以下3个event handlers

react-testing-library

Submitted by Lizhe on Mon, 06/11/2018 - 16:27

任意目录下的 *.test.js

__tests__ 目录下的 *.js

 

import React from 'react'
import {renderIntoDocument, cleanup} from 'react-testing-library'
import App from '../App'
import * as jestDom from 'jest-dom'

expect.extend(jestDom)

afterEach(cleanup)

React ES6 优化笔记

Submitted by Lizhe on Mon, 06/11/2018 - 08:29

以下内容为最近一段时间使用React的优化笔记

1. 使用解构传递参数

const AddPlayerForm = ({ values, onSubmit, onChange }) => {

    return (...)

}

2. promise函数中不一定要使用_this


          .then(response => {
              if(this.isMountedDone) {
                  this.setState({
                      options: response.data
                  });
              }

3.     Stop Memory Leaks with componentWillUnmount Lifecycle Method in React

Kong API Gateway Load Balance

Submitted by Lizhe on Fri, 06/01/2018 - 12:15

第一步你需要创建一个upstream

这里命名为 helloworld_upstream

[admin@localhost ~]$ curl -i -X POST --url http://localhost:8001/upstreams/ -d "name=helloworld_upstream"
HTTP/1.1 201 Created
Date: Fri, 01 Jun 2018 04:17:49 GMT
Content-Type: application/json; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Access-Control-Allow-Origin: *
Server: kong/0.13.1

Kong API Gateway Helloworld

Submitted by Lizhe on Fri, 06/01/2018 - 09:09

 

 

[admin@localhost ~]$ curl -i -X POST http://localhost:8001/apis/ -d "name=helloworld" -d "uris=/helloworld" -d "upstream_url=http://www.baidu.com"
HTTP/1.1 201 Created
Date: Fri, 01 Jun 2018 01:59:15 GMT
Content-Type: application/json; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Access-Control-Allow-Origin: *
Server: kong/0.13.1

Kong API Gateway Install and Start

Submitted by Lizhe on Thu, 05/31/2018 - 09:20

https://bintray.com/kong/kong-community-edition-rpm/download_file?file_path=centos/7/kong-community-edition-0.13.1.el7.noarch.rpm

sudo yum install epel-release

sudo yum install kong-community-edition-0.13.1.el7.noarch.rpm

 

安装数据库

sudo yum install https://download.postgresql.org/pub/repos/yum/9.4/redhat/rhel-7-x86_64/pgdg-centos94-9.4-3.noarch.rpm

 

sudo yum install https://download.postgresql.org/pub/repos/yum/9.6/redhat/rhel-7.6-x86_64/pgdg-centos96-9.6-3.noarch.rpm

sudo yum install postgresql94