作用域和闭包

2016-06-14

JS

函数作用域和块级作用域

IIFE

IIFE代表立即执行函数表达式，他可以导致代码的运行顺序，将需要运行的函数放在第二位
1
2
3
4
5
6
7
8
var a = 2;
(function(def) {
  def(window)
})(function def(global) {
  var a = 3;
  console.log(a);
  console.log(global.a);
})

变量提升

只有声明本身会被提升，而赋值或其他运行逻辑会留在原地。如果提升改变了代码执行的顺序，会
造成非常严重的破坏。
函数声明和变量声明都会被提升。但是一个值得注意的细节是函数会首先被提升，然后才是变量。

2016-06-07

Canvas

画布学习的总结

canvas元素的大小与绘图表面积的大小

canvas元素实际上有两套尺寸，一个是元素本身的大小，还有一个是元素绘图表面的大小。当设置
元素的width和height属性时，实际上同时修改了该元素本身的大小与元素绘图表面的大小。然而如
果通过CSS来设定canvas元素的大小，那么只会改变元素本身的大小，而不会影响到绘图表面。当元
素的大小不符合绘图表面的大小时，浏览器就会对绘图表面进行缩放

Canvas状态的保存与恢复

Canvas的API提供了两个名叫save()和restore()的方法，用于保存及恢复当前canvas绘图环境的
所有属性。绘图环境的save()方法将当前的绘图环境压入栈顶顶部。对应的restore()方法则会从堆
栈顶部弹出一组状态信息，并据此恢复当前绘图环境的各个状态。
save():将当前的canvas状态推送到一个保存canvas状态的堆栈顶部。canvas状态包括了当前的坐
标变换信息，剪辑区域以及所有canvas绘图环境对象的属性，包括strokeStyle、fillStyle、与
globalCompositeOperation等，canvas状态并不包括当前的路径或位图。只能通过beginPath()
来重置路径
restore():将canvas状态堆栈顶部的条目弹出。原来保存于栈顶的那一组状态，在弹出之后，就被
设置成canvas当前的状态了，因此，在调用save()和restore()方法之间，对canvas状态所进行的
修改，其效果只会持续至restore()方法调用之前

2016-05-31

React Native

react-native-vector-icons如何使用自己的iconfont

react-native-vector-icons的git地址

如何使用自己的iconfont呢?

首先将你的定义的iconfont.css放到你的RN项目根目录下，然后在根目录下执行
./node_modules/.bin/generate-icon ./iconfont.css --componentName=MyIcon --fontFamily=myicon > MyIcon.js

执行完成之后你会发现在根目录多了一个MyIcon.js，生成的MyIcon.js内容如下:

import createIconSet from './lib/create-icon-set';
const glyphMap = {
  "icabout": 58881,
  "btnclose": 58882,
};
let MyIcon = createIconSet(glyphMap, 'myicon', 'MyIcon.ttf');
module.exports = MyIcon;
module.exports.glyphMap = glyphMap;

将生成的MyIcon.js放到node_modules/react-native-vector-icons,并且将你的.ttf文件放入node_modules/react-native-vector-icons/Fonts文件夹中

2016-05-25

JS

作用域

变量的赋值会执行两个动作，首先编译器会在当前作用域中声明一个变量（如果之前没有声明过），
然后运行时引擎会在作用域中查找该变量，如果能够找到就会对它赋值。

LHS和RHS

LHS和RHS的含义是”赋值操作的左侧或右侧”并不一定意味着”=赋值操作的左侧和右侧”。赋值操作
还有其他几种形式，因此在概念上最好理解为”赋值操作的目标是谁(LHS)”以及”谁是赋值操作的源
头(RHS)”。

作用域嵌套

当一个块或函数嵌套在另一个块或函数中时，就发生了作用域嵌套。因此，在当前作用域中无法找
到某个变量时，引擎就会在外层嵌套的作用域中继续查找，直到找到该变量，或抵达最外层的作用域
（也就是全局作用域）为止。

RHS和LHS

如果RHS查询在所有嵌套的作用域中遍寻不到所需的变量，引擎就会抛出ReferenceError异常。
当引擎执行LHS查询时，如果在顶层中也无法找到目标变量，全局作用域就会创建一个具有该名称的
变量，并将其返回给引擎，前提是程序运行在”非严格模式”下。ES5引入了严格模式，严格模式禁止
自动或隐士地创建全局变量。因此，在严格模式中LHS查询失败时，并不会创建并返回一个全局变量，
引擎会抛出同RHS查询失败时类似的ReferenceError异常。ReferenceError同作用域判别失败相关，
而TypeError则代表作用域判别成功了，但是对结果的操作是非法或不合理的。

总结

作用域是一套规则，用于确定在何处以及如何查找变量。如果查找的目的是对变量进行赋值，那么
会使用LHS查询；如果目的是获取该变量的值，就会使用RHS查询。
JavaScript引擎首先会在代码执行前对其进行编译，在这个过程中，像var a = 2这样的声明会
被分解成两个独立的步骤：

首先，var a在其作用域中声明新变量。这会在最开始的阶段，也就是代码执行前进行。

接下来， a = 2会查询(LHS查询)变量a对其进行赋值。

每天进步一点点