ES6学习笔记之let && const

2016-01-31

ES6新增了let和const命令，用来声明变量。

let命令

基本用法

let的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。

{
  let a = 10;
  var b = 6;
}
console.log(a); //undefined
console.log(b); //6

上面代码在代码块之中，分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量undefined，var声明的变量返回了正确的值。这表明，let声明的变量只在它所在的代码块有效。

more >>

展开全文 >>

ES6学习笔记

2016-01-23

ECMAScript 6简介

ECMAScript6（以下简称ES6）是JavaScript语言的下一代标准，已经在2015年6月正式发布了。它的目标，是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015，也就是说，ES6就是ES2015。

工具安装

因为目前各大游览器对ES6的支持不是很好，所以我们需要用到工具对ES6进行转码，这里我们用babel来转码，因为项目里面还会用到其他前端自动化的东西，所以这里我们选择用gulp+babel

安装gulp

1	npm install --save-dev gulp

安装gulp-babel

1	npm install --save-dev gulp-babel

more >>

展开全文 >>

移动端关于px,rem,em的选择

2016-01-17

先来介绍下这三个单位：

px：px是Pixel（像素）的缩写，相对长度单位，这个是相对于屏幕的分辨率来说的。
em：相对于父亲元素的单位，例如设置body为font-size:62.5%因为游览器默认body是16像素，这样计算就可以使得1em = 10px，方便计算。但是这里会存在一个问题，em是相对于父元素的，例如一个ul是16px即为1.6em，里面有li为1.6em，这样计算的话li的实际font-size为10x16x16，如果里面有其他元素就更麻烦了，这里可以设置li li, li p, li span, li p span, p span{font-size:1em}来重置字体，但是结构复杂的时候就很麻烦了。
rem：root em，看到这个我们就可以理解rem是相对根元素html的，例如如果设置font-size:16px，然后设置p{font-size:1rem},那么这里的p标签就是16px。

接下来说一下几个概念：

物理像素（physical pixel）：一个物理像素是显示器(手机屏幕)上最小的物理显示单元，在操作系统的调度下，每一个设备像素都有自己的颜色值和亮度值。
设备独立像素（density-independent pixel）：设备独立像素(也叫密度无关像素)，可以认为是计算机坐标系统中得一个点，这个点代表一个可以由程序使用的虚拟像素(比如: css像素)，然后由相关系统转换为物理像素。
设备像素比(device pixel ratio )：设备像素比(简称dpr)定义了物理像素和设备独立像素的对应关系，它的值可以按如下的公式的得到设备像素比 = 物理像素 / 设备独立像素
more >>