摘要: JSX IN DEPTH _______ JSX 从根本上说,JSX只是提供了语法糖React.createElement(component, props, ...children)的功能。以下JSX代码: 指定React元素类型 一个JSX标签的第一部分确定了React元素的类型。 大写类型表明 阅读全文
posted @ 2017-01-04 23:12 shelfy 阅读(374) 评论(0) 推荐(0) 编辑
摘要: Lifting State Up state提升 1. 对于在React应用程序中更改的任何数据,应该有一个单一的数据源。通常,都是将state添加到需要渲染的组件。如果其他组件也需要它,您可以将其提升到最接近的共同祖先。而不是尝试在不同组件之间同步状态,您应该依赖于自上而下的数据流。 2. 如果一 阅读全文
posted @ 2017-01-04 23:11 shelfy 阅读(972) 评论(0) 推荐(0) 编辑
摘要: Lists and Keys React支持以数组的形式来渲染多个组件,它会将你数组中的每个组件以列表的形式渲染开来。 当你使用数组的方式来渲染你的组件时,你需要给每个组件一个Key值,否则会出现一个警告,提示指出应该为列表的每一项提供一个属性key,如下代码所示: 分配key后的代码如下: Key 阅读全文
posted @ 2017-01-04 23:09 shelfy 阅读(190) 评论(0) 推荐(0) 编辑
摘要: Components 组件 1.组件 可以让UI独立的分割出来,可以让UI重复利用。 2.组件就像是JavaScript函数,它们能够接收任意的输入(称为“props”,即属性)并且返回React元素。 3.组件可以嵌套组件。 用javascript函数定义一个组件(Functional Compo 阅读全文
posted @ 2017-01-04 23:06 shelfy 阅读(140) 评论(0) 推荐(0) 编辑
摘要: 第23节 React Render Element 1、Element 元素是反应应用程序的最小积木。 元素描述你在屏幕上看到的内容.: ==不同于浏览器的DOM元素,react元素是普通的对象,React 通过解析每一个创建的 Element, 计算出需要对 DOM 进行的实际操作来完成渲染的== 阅读全文
posted @ 2017-01-04 23:05 shelfy 阅读(358) 评论(0) 推荐(0) 编辑
摘要: React JSX语法 JSX只是一个语法糖,每一个XML标签都会被JSX转换工具转换成纯Javascript代码,当然你想直接使用纯Javascript代码写也是可以的,只是利用JSX,组件的结构和组件之间的关系看上去更加清晰。 例如: 会被转化成 这个方法的第一个参数可以是一个字符串,表示是一个 阅读全文
posted @ 2017-01-04 23:04 shelfy 阅读(224) 评论(0) 推荐(0) 编辑
摘要: Class基本语法 关于es6的class简介: ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。基本上,ES6的class可以看作只是一个语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让对象原型的写法更加清晰、 阅读全文
posted @ 2017-01-04 23:03 shelfy 阅读(140) 评论(0) 推荐(0) 编辑
摘要: React的学习 React概述: React是一个用于构建用户界面的JavaScript库。 React主要用于构建UI,很多人认为React是MVC中的V(视图)。 React起源于Facebook 的内部项目,用来假设Instagram的网站,并与2013年5月开源。 React拥有较高的性能 阅读全文
posted @ 2017-01-04 23:03 shelfy 阅读(157) 评论(0) 推荐(0) 编辑
摘要: Promise 概念 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。 特点 1. 对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rej 阅读全文
posted @ 2017-01-04 23:02 shelfy 阅读(188) 评论(0) 推荐(0) 编辑
摘要: 第18课 ES6(1) 模块化 1.export和import javascript // model.js export default let m = 1; // 出错 export default n = 2; let func1 = value = console.log( ) let fu 阅读全文
posted @ 2017-01-04 23:01 shelfy 阅读(105) 评论(0) 推荐(0) 编辑
摘要: 一、函数介绍 1、bind 结构 说明 一个对象中所有的成员函数的this都指向这个对象 举例 2、bindAll 结构 说明 最常见的方法。作用是改变默认的function中的this指向。 举例 3、once 结构 说明 能确保func只调用一次,如果用func返回一个什么对象,这个对象成了单例 阅读全文
posted @ 2017-01-04 23:00 shelfy 阅读(107) 评论(0) 推荐(0) 编辑
摘要: 第16课 underscore库 一、介绍 Underscore 是一个 JavaScript 工具库,它提供了一整套函数式编程的实用功能,但是没有扩展任何 JavaScript 内置对象。他弥补了 jQuery 没有实现的功能,同时又是 Backbone 必不可少的部分。 二、集合方法介绍 集合函 阅读全文
posted @ 2017-01-04 22:59 shelfy 阅读(194) 评论(0) 推荐(0) 编辑
摘要: 正则符号补充 表达式 | 描述 | {n} | n 是非负整数。正好匹配 n 次。 {n,m} | n 和 m 是非负整数,其中 n 阅读全文
posted @ 2017-01-04 22:58 shelfy 阅读(137) 评论(0) 推荐(0) 编辑
摘要: 正则表达式(中) 特殊字符 限定符 限定符用来指定正则表达式的一个给定组件必须要出现多少次才能满足匹配。有 或+或?或{n}或{n,}或{n,m}共6种。\ 、 +和?限定符都是贪婪的,因为它们会尽可能多的匹配文字,只有在它们的后面加上一个?就可以实现非贪婪或最小匹配。 字符 | 描述 | | 匹配 阅读全文
posted @ 2017-01-04 22:57 shelfy 阅读(232) 评论(0) 推荐(0) 编辑
摘要: 正则表达式(上) 主要内容 正则表达式概述 正则表达式的运行 创建正则表达式 特殊字符: \、^、$ 概述 正则表达式,又称规则表达式。(英语:Regular Expression,在代码中常简写为regex、regexp或RE),计算机科学的一个概念。正则表通常被用来检索、替换那些符合某个模式(规 阅读全文
posted @ 2017-01-04 22:56 shelfy 阅读(167) 评论(0) 推荐(0) 编辑
摘要: JS声明变量 变量必须以字母开头 变量也能以 $ 和 _ 符号开头(不推荐这么做) 变量名称对大小写敏感(y 和 Y 是不同的变量) 提示:JavaScript 语句和 JavaScript 变量都对大小写敏感。 声明变量的关键字有3个: var , let , const. 后两个是在es6中新定 阅读全文
posted @ 2017-01-04 22:54 shelfy 阅读(145) 评论(0) 推荐(0) 编辑
摘要: 字符串是 JavaScript 的一种基本的数据类型。 String 对象的 length 属性声明了该字符串中的字符数。 ==需要注意的是==,JavaScript 的字符串是不可变的( immutable),String 类定义的方法都不能改变字符串的内容。 以下是字符串的一些常用方法: con 阅读全文
posted @ 2017-01-04 22:54 shelfy 阅读(316) 评论(0) 推荐(0) 编辑
摘要: 数组的定义和创建 数组是值得有序集合。JavaScript数组是无类型的。 数组对象的作用是:使用单独的变量名来存储一系列的值。 数组的创建 有两种向数组赋值的方法(你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样) ==注意==:如果你需要在数组内指定数值或者逻辑值,那么变量类型应该是 阅读全文
posted @ 2017-01-04 22:53 shelfy 阅读(682) 评论(0) 推荐(0) 编辑
摘要: 第九课 this 一、this基本概念 this是Javascript语言的一个关键字。在JavaScript中,this是动态绑定,或称为运行期绑定的。在不同的情况下,this指向各不相同。但是有一个总的原则,那就是this指的是,调用函数的那个对象。 1.全局范围内 当在全部范围内使用 this 阅读全文
posted @ 2017-01-04 22:52 shelfy 阅读(100) 评论(0) 推荐(0) 编辑
摘要: 1.回调 javascipt中,函数回调一般用于以下几种场景: 1.异步执行(例如读取文件,进行HTTP请求) 2.同步(阻塞) 3.事件监听和处理 4.设置超时和时间间隔的方法 异步例子(使用AJAX加载XML文件的示例,并且使用了call()函数,在请求对象(requested object)上 阅读全文
posted @ 2017-01-04 22:50 shelfy 阅读(153) 评论(0) 推荐(0) 编辑