第4节:ReactNative必备的语言基础知识

[TOC]

ReactNative必备的语言基础知识

参考文章:

ReactNative的语法基础要求JS,JSX,ES6.其中ES6是这三种语法的核心。系统学习ES6的语法是ReactNative编程的基本要求。

下面记录ES6的典型语法的示例,以方便编程中的随时查用。

一、关键字

参考文章:极客学院 ECMAScript 6 let 和 const 命令

关键字 用途 作用域
const 声明常量,不可修改
var 声明变量
let 声明变量 let 声明的变量只在它所在的代码块有效 for 循环的计数器,就很合适使用 let 命令。

二、变量的解构赋值

参考文章:

对变量复制时,当等号左边定义的变量和等号右边的赋值形式一致时,能够对变量自动赋值;

1
2
3
4
5
6
7
8
let {a, b} = {a:"x", b:"y"};
//a = x, b = y;

let [a, b] = [0, 1, 2, 3];
//a=0, b = 1;

let [a, ...b] = [0, 1, 2, 3];
//a=0, b = [1,2,3];

常见于:

  • style的解构赋值

三、Generator函数

参考文章:极客学院 ECMAScript 6 Generator 函数

通过在函数名前添加 * 和在方法中添加 yield 关键字来定义,控制函数的顺序执行.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// 设有如下函数
function *genFun() {
yield 'Lily';
yield 'Json';
return 'Niu';
}


// 则以下第一种调用的写法及结果如下:
let gen = genFun();
genFun().next();//{value: 'Lily', done: false}
genFun().next();//{value: 'Json', done: false}
genFun().next();//{value: 'Niu', done: true}

// 则以下第二种调用的写法及结果如下:
for (i of gen) { //使用for of 语句来遍历
console.log(i);
}
//return后的元素,不会被遍历到
Lily
Json

四、Promise对象

参考文章:极客学院 ECMAScript 6 Promise 对象

通过定义Promise和关键字then的结合,可以方便实现函数的成功回调和失败回调。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
1)定义
var prom = new Promise((resolve, reject) => {
setTimeout(() => {
console.log('download success')
resolve('success');
}, 1000);
});

prom.then((flag) => {
console.log('success block:' + flag);
}, (error) => {
console.log('failure block:' + error);
})

(2)async关键字和Promise实例相结合,实现多个异步线程的顺序执行;
async function foo() {
await new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, 5000);
});

console.log('await function completed');
}
foo();
//打印消息会在5s后resolve回调执行后,才执行;