ES6 与 React
Node和NPM
/*安装npm*/
npm install
npm install <package>
npm install -g <package>
/*更新安装包*/
npm update <package>
npm update -g <package>
卸载安装包
npm uninstall <package>
npm uninstall -g <package>
React项目搭建命令
/*安装React
npm install -g create-react-app
/*创建项目*/
create-react-app my-app
/*进入项目所在的目录*/
cd my-app
/*启动项目*/
npm start
/*安装依赖*/
npm install
/*编译项目*/
npm run build
安装webpack和webpack-cli
npm install --save-dev webpack webpack-cli -g
GIT GUI(可视化工具)
https://blog.csdn.net/qq_15509267/article/details/83617029
/*初始化仓库*/
git init
/*添加文件到本地仓库*/
git add .(文件name)
/*添加文件描述信息*/
git commit -m "first commit"
/*链接远程仓库,创建主分支*/
git remote add origin + 远程仓库地址
/*把本地仓库的变化连接到远程仓库主分支*/
git pull origin master
/*把本地仓库的文件推送到远程仓库*/
git push -u origin master
从GitHub向本地down文件
git clone '代码仓库的SSH地址'
打包工具
webpack是一个打包工具
https://blog.csdn.net/u010289890/article/details/82663082
taro和dva
https://taro.aotu.io
https://dvajs.com
/*安装taro (cnpm为淘宝镜像)*/
cnpm install -g @tarojs/cli
/*创建项目*/
taro init taro-demo
/*安装与 react-redux*/
cnpm install --save redux @tarojs/redux @tarojs/redux-h5 redux-thunk redux-logger
/*安装dva*/
cnpm install --save dva-core dva-loading
命令:
var let const
数组解构赋值:
let [a = 1] = [];
let [a, b, c] = [1, 2, 3];
let [a, b, c] = new Set([1, 2, 3]);
对象解构赋值:
let { log, sin, cos } = Math;
let { a, b } = { a: 1, b: 2 };
let x; ({ x } = { x: 1 });
字符串解构赋值
const [a, b, c] = '123';
let { length: len } = '123';
函数参数解构赋值
function func([x, y])
var f = v => v; 等同于 var f = function (v) { return v; };
(() => { console.log(1); })();
遍历 Map 结构
const items = new Map();
items.set(1, 2);
items.set(3, 4);
for (let [key, value] of items) { key + value } 或者 [[1, 2], [3, 4]].map(([a, b]) => a + b);
输入模块的指定方法
const { fn, func } = require("source-map");
字符的 Unicode 表示法
let txt = "\u0061";
let txt = "\u{0061}";
字符串的遍历器接口
(let i of text)
模板字符串,用反引号(`)标识
字符串中嵌入变量
let name = "micro";
var txt = `Name ${name}`
数据结构 Set
const s = new Set([1, 2, 3, 4, 4]);
const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));
for (let i of s)
Class 语法
class Func {
constructor() { }
add(x, y) {
return x + y;
}
get prop() {
return 0;
}
set prop(value) {
console.log(value);
}
}
let fn = new Func();
fn.add(1, 2)
let Func = new class {}
静态方法和属性
class Func {
static prop = 1;
static add(x, y) {
return x + y;
}
}
私有方法和私有属性
class Func {
add(x, y) {
fn.call(this, x, y);
}
}
function fn(x, y) { }
类继承静态方法
class Fn extends Func { }
Module 的语法
<script type="module"></script>
ES6 与 React的更多相关文章
- React与ES6(四)ES6如何处理React mixins
React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...
- ES6与React中this完全解惑
计划写很长的篇幅,预计12月初完成. 这篇文章涉及的知识较多,可能一次消化不了,可以渐渐来. 先说结论: 无论是ES6还是React的this,相对于ES5,只是增加了箭头函数this绑定了其封闭上下 ...
- Webstorm 不识别es6 import React from ‘react’——webstorm不支持jsx语法怎么办
2016-10-31更新 webstorm不支持es6语法怎么办? webstorm不支持jsx语法怎么办? 参考:webstorm不支持jsx语法怎么办 I spent ages trying to ...
- ES6+ 开发 React 组件
在这里简要的说一下这些语言新特性对 React 应用的开发有什么影响,这些 ES6+ 特性使得 React 开发更简单更有趣. 类 迄今为止,最能体现我们使用 ES6+ 来编写 React 组件的就是 ...
- ES6, Angular,React和ABAP中的String Template(字符串模板)
String Template(字符串模板)在很多编程语言和框架中都支持,是一个很有用的特性.本文将Jerry工作中使用到的String Template的特性做一个总结. ES6 阮一峰老师有一个专 ...
- ES6 + Webpack + React + Babel 如何在低版本浏览器上愉快的玩耍
https://blog.csdn.net/a324539017/article/details/52824189
- 大前端-全栈-node+easyui+express+vue+es6+webpack+react
作者声明:本博客中所写的文章,都是博主自学过程的笔记,参考了很多的学习资料,学习资料和笔记会注明出处,所有的内容都以交流学习为主.有不正确的地方,欢迎批评指正 视频来源:https://www.bil ...
- webpack踩坑之路——构建基本的React+ES6项目
转自:http://www.cnblogs.com/ghost-xyx/p/5483464.html webpack是最近比较火的构建工具,搭配上同样比较火的ReacJS与ES6(ES2015)一定是 ...
- React,React Native中的es5和es6写法对照
es6用在React中的写法总结: 在es6还没有完全支持到浏览器的阶段里,已经有很多技术人员开始用es6的写法来超前编程了,因为有转义es6语法的工具帮助下,大家才可大量使用.解析看看es6写法用在 ...
随机推荐
- spring开发需要的配置文件
1,applicationContext-dao.xml <?xml version="1.0" encoding="UTF-8"?><bea ...
- day63 django-模板语言
我们的功能是需要解耦的,从开始就一直在强调这一点,所以我们的函数需要另外放到一个单独的文件里面,一般都是放到views文件里面,views叫做视图,一般术语叫做视图函数,用来进行各种逻辑判断的,需要一 ...
- P2659 美丽的序列
P2659 美丽的序列对于当前的最小值,找到最大的左右边界,然后更新答案.用单调队列确定左右边界,O(n)做法. #include<iostream> #include<cstdio ...
- unity3d俄罗斯方块源码教程+源码和程序下载
小时候,大家都应玩过或听说过<俄罗斯方块>,它是红白机,掌机等一些电子设备中最常见的一款游戏.而随着时代的发展,信息的进步,游戏画面从简单的黑白方块到彩色方块,游戏的玩法机制从最简单的消方 ...
- 大数据项目之_15_电信客服分析平台_03&04_数据分析
3.3.数据分析3.3.1.Mysql 表结构设计3.3.2.需求:按照不同的维度统计通话3.3.3.环境准备3.3.4.编写代码:数据分析3.3.5.运行测试3.3.6.bug 解决 3.3.数据分 ...
- mybatis查询语句的背后之封装数据
转载请注明出处... 一.前言 继上一篇mybatis查询语句的背后,这一篇主要围绕着mybatis查询的后期操作,即跟数据库交互的时候.由于本人也是一边学习源码一边记录,内容难免有错误或不足之处,还 ...
- AS安装过程中出现的错误
1.首先是You may need to adjust the proxy settings in Gradle.的错误, 主要是看你有没有图中红线所画的gradle的压缩包 如果没有,那就前往htt ...
- Python3基础-特别函数(map filter partial reduces sorted)实例学习
1. 装饰器 关于Python装饰器的讲解,网上一搜有很多资料,有些资料讲的很详细.因此,我不再详述,我会给出一些连接,帮助理解. 探究functools模块wraps装饰器的用途 案例1 impor ...
- LeetCode(122. 买卖股票的最佳时机 II)
问题描述 给定一个数组,它的第 i 个元素是一支给定股票第 i 天的价格. 设计一个算法来计算你所能获取的最大利润.你可以尽可能地完成更多的交易(多次买卖一支股票). 注意:你不能同时参与多笔交易(你 ...
- Centos ATI 显卡安装,“LCD 信号超出范围” 解决方法
centso ATI 显卡驱动安装 centos 版本 32位 6.4 Final ATI 显卡版本:Radeon HD 7400 Series 之前由于很久自己安装了centos显卡,分辨率很低不能 ...