前言 不论是React还是React-native,facebook官方都推荐使用ES6的语法,没在项目中使用过的话,突然转换过来会遇到一些问题,如果还没有时间系统的学习下ES6那么注意一些常见的写法暂时也就够用的,这会给我们的开发带来很大的便捷,你会体验到ES6语法的无比简洁.下面就介绍我在react和react-native中从ES5转到ES6中体会到的几个对比. ES6写组件的区别 直接在React v0.13.0 Beta 1中一个官方的演示来说明: export class Count…

ES6简介 Babel转码器 Nodejs中使用ES6 WebPack中使用ES6及Babel转码插件 一.ES6简介与转码  1.1一个常见的问题,ECMAScript和JavaScript到底是什么关系? 1996年11月,JavaScript的创造者——Netscape公司,决定将JavaScript提交给国际标准化组织ECMA,希望JavaScript这种语言能够成为国际标准. 1997年,ECMA发布262号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言…

这是官网上的一个简单的例子 const name = 'Josh Perez'; const element = <h1>Hello, {name}</h1>; ReactDOM.render( element, document.getElementById('root') ); 从中可以看到:      jsx    是可以在里面写js代码的,     在{   }里面写js代码    在这里我解释一下,为什么可以在react里的HTML标签里面的{}里写js代码   Babe…

首发于:https://mingjiezhang.github.io/(转载请说明此出处). 在JavaScript中,this对象是运行时基于函数的执行环境(也就是上下文)绑定的. 从react中的demo说起 Facebook最近一次更新react时,将es6中的class加入了组件的创建方式当中.Facebook也推荐组件创建使用通过定义一个继承自 React.Component 的class来定义一个组件类.官方的demo: class LikeButton extends React.…

Node本身已经支持部分ES6语法,但是import export,以及async await(Node 8 已经支持)等一些语法,我们还是无法使用.为了能使用这些新特性,我们就需要使用babel把ES6转成ES5语法 安装babel npm install babel-cli -g <!-- more --> 基础知识 babel的配置文件是.babelrc { "presets": [] } 新建一个demo文件夹,文件夹下新建 1.js const arr = [1,…

计划写很长的篇幅,预计12月初完成. 这篇文章涉及的知识较多,可能一次消化不了,可以渐渐来. 先说结论: 无论是ES6还是React的this,相对于ES5,只是增加了箭头函数this绑定了其封闭上下文,自己实现了该词法,其它的关于this的与ES5仍然一样. 目录: 1.ES5中对this使用的4种方式 2.ES6中箭头函数中的this 3.ES6中class中的this 4.React中组件里的this 组件里事件函数,其实相当于把对象方法赋值给新变量后再调用,这和ES5中是一样的,变成了函…

React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React与ES6(四)ES6如何处理React mixins 前一篇的内容太简单了,会不会很失望.这次就来一个接近实际应用的例子,对应的React的组件也会更加复杂.这次开发一个购物车的页面.在这个页面中你会看到某个产品的信息,比如:图片.名称和价格.另外,一个用户可以增加和减少该商品的数量. 创建cart…

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 ECMAScript 是 JS 的语言标准.而 ES6 是新的 JS 语法标准. PS:严格来说,ECMAScript 还包括其他很多语言的语言标准. ECMAScript 发展历史 1995年:ECMAScript 诞生. 1997年:ECMAScript 标准确立. 1999年:ES3 出现,与此同时,IE5 风靡一时. 2009年,ES5 出现,例如 for…

1.NPM: 参考:npm使用入门  npm 学习笔记整理 2.ES6参考:ES6 let命令:ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. const命令:const声明一个只读的常量.一旦声明,常量的值就不能改变. const的作用域与let命令相同:只在声明所在的块级作用域内有效. 资料:React 语法之let和const命令 箭头函数:箭头函数 ES6:ES6(阮一峰)学习总结 super:super关键字用于访问和调…

概述 本身是前端小白,学过html,css,js的各种书,各种视屏,就是没有接触web开发的内容.偶然看见一个朋友用react搭建了一个博客,于是本着程序员无所不能的精神,也尝试着用react搭建博客. 下面记录我从小白到搭建博客的过程,没有写方法,因为网上已经很多方法了. 这是我搭建的博客地址:馒头加梨子 结论 先说结论,我学到了什么: 单页面web开发的流程.把要做的分为一个个模块,逐个实现,然后用webpack设置,开发并打包上线. antd库的使用和一些组件的配置参数. 相关知识:SPA…