JavaEdge全是干货的技术号

声明 State 变量在 class 中，我们通过在构造函数中设置 this.state 为 { count: 0 } 来初始化 count state 为 0：class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; }在函数组件中，我们没有 this，所以我们不能分配或读取 this.state。我们直接在组

父子组件间通信这种情况下很简单，就是通过 props 属性传递，在父组件给子组件设置 props，然后子组件就可以通过 props 访问到父组件的数据／方法，这样就搭建起了父子组件间通信的桥梁。import React, { Component } from 'react';import { render } from 'react-dom';class GroceryList extends Component { handleClick(i) { console.log('You

class CmtList extends React.Component { constructor() { super(); this.state = { CommentList: [ {id:1, user: 'sss', content: 'java'}, {id:2, user: 'sss', content: 'java'}, {id:3

React 元素的事件处理和 DOM元素的很相似。但语法有点不同：React事件绑定属性的命名采用小驼峰。如果采用 JSX，需传入一个函数作为事件处理函数，而不是一个字符串(DOM元素的写法)。例如，传统的 HTML：React 中稍稍不同React 中另一个不同是你不能使用返回 false 的方式阻止默认行为。必须明确使用 preventDefault。例如，传统的 HTML 中阻止链接默认打开一个新页面，可以这样写：在 React，应该这样写使用 React 的时候通常你不需

使用 class 声明创建一个基于原型继承的具有给定名称的新类。class Animal { // 和 java 一样，未指定时有默认的空构造器 constructor(name, age) { this.name = name; this.age = age; }}const a1 = new Animal('狗蛋儿', 3);console.log(a1);console.log(a1.name);console.log(a1.age

对于使用基于类的语言，如 Java 的开发人员，js 令人困惑，因为它是动态的，并且本身不提供一个 class 实现。（在 ES2015/ES6 中引入了 class 关键字，但那只是语法糖，JavaScript 仍是基于原型）。谈到继承时，js 只有一种结构：对象。每个实例对象（ object ）都有一个私有属性（称之为 __proto__ ）指向它的构造函数的原型对象（prototype ）。该原型对象也有一个自己的原型对象( proto ) ，层层向上直到一个对象的原型对象为 null。根据定义，

组件可以将UI切分成一些独立的、可复用的部件，这样就只需专注于构建每一个单独的部件。组件从概念上看就像是函数，它可以接收任意的输入值（称之为props），并返回一个需要在页面上展示的React元素。const me = { name: 'JavaEdge', age: "18", gender: 'boy'}ReactDOM.render(<div> 123 <Hello name={me.name}></Hello></div>, do

创建虚拟DOM元素什么是虚拟DOM用Js对象的形式，来表示DOM和DOM之间的嵌套关系。const mydiv = React. createElement('div', { id: 'mydiv', title: 'div aaa' }，'这是一 个div元素' )HTML是最优秀的标记语言。在JS文件中，默认不能写这种类似于HTML的标记;否则打包会失败;可以使用babel 来转换这些JS中的标签。这种在JS中，混合写入类似于HTML的语法，叫做JSX。符合 XML规范的JS。JSX

JavaScript的 Array 对象是用于构造数组的全局对象，数组是类似于列表的高阶对象。创建数组var fruits = ['Apple', 'Banana'];console.log(fruits.length);// 2通过索引访问数组元素var first = fruits[0];// Applevar last = fruits[fruits.length - 1];// Banana遍历数组fruits.forEach(function (item, index

更简短的函数并且不绑定this。箭头函数表达式的语法比函数表达式更简洁，并且没有自己的this，arguments，super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方，并且它不能用作构造函数。语法(param1, param2, …, paramN) => { statements }(param1, param2, …, paramN) => expression//相当于：(param1, param2, …, paramN) =>{ retu

1 生命周期图流程图结构图组件初始化：先调用getDefaultProps()getInitialState()render第一次 render 后，调用 componentWillMount、componentDidMount之后：componentWillUpdate、componentDidUpdate众所周知，做这些流程，就是为了形成钩子方法。目前,我们只学习了一种方法来更新UI,即调用 ReactDOM.render() 改变输出在本节中，将学习如何使Clock

node.jsnodejs简介定义JS的服务端运行环境用途构建工具webpack的环境依赖特点单线程、异步编程应用场景低运算、高I/ONodejs的包管理工具一npm安装npm initWebpack设计思想require anything加载方式各种loader插件编译方式commonjs模块-> function类型模块官方文档http://webpack.github.io/docs/安装sudo npm install -g