let 和 const 命令
let 命令
基本用法
ES6
新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。
1234567{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1
上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。
for循环的计数器,就很合适使用let命令。
123456for (let i = 0; i < 10; i++) { // ...}console.log(i);// ReferenceError: i is not defined
上面代码中,计数器i只在for循环体内有效,在循环体外引用就会报错。
下面的代码如果使用var,最后输出的是10。
1234567var a = [];for (var i = 0; i ...
Object 对象
概述
JavaScript
原生提供Object对象(注意起首的O是大写),本章介绍该对象原生的各种方法。
JavaScript
的所有其他对象都继承自Object对象,即那些对象都是Object的实例。
Object对象的原生方法分成两类:Object本身的方法与Object的实例方法。
(1)Object对象本身的方法
所谓“本身的方法”就是直接定义在Object对象的方法。
1Object.print = function (o) { console.log(o) };
上面代码中,print方法就是直接定义在Object对象上。
(2)Object的实例方法
所谓实例方法就是定义在Object原型对象Object.prototype上的方法。它可以被Object实例直接使用。
123456Object.prototype.print = function () { console.log(this);};var obj = new Object();obj.print() // Object
上面代码中,Obje ...
ECMAScript 6 简介
ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在
2015 年 6 月正式发布了。它的目标,是使得 JavaScript
语言可以用来编写复杂的大型应用程序,成为企业级开发语言。
ECMAScript 和 JavaScript
的关系
一个常见的问题是,ECMAScript 和 JavaScript 到底是什么关系?
要讲清楚这个问题,需要回顾历史。1996 年 11 月,JavaScript 的创造者
Netscape 公司,决定将 JavaScript 提交给标准化组织
ECMA,希望这种语言能够成为国际标准。次年,ECMA 发布 262
号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为
ECMAScript,这个版本就是 1.0 版。
该标准从一开始就是针对 JavaScript 语言制定的,但是之所以不叫
JavaScript,有两个原因。一是商标,Java 是 Sun
公司的商标,根据授权协议,只有 Netscape 公司可以合法地使用 JavaScript
...
console 对象与控制台
console 对象
console对象是 JavaScript 的原生对象,它有点像 Unix
系统的标准输出stdout和标准错误stderr,可以输出各种信息到控制台,并且还提供了很多有用的辅助方法。
console的常见用途有两个。
调试程序,显示网页代码运行时的错误信息。
提供了一个命令行接口,用来与网页代码互动。
console对象的浏览器实现,包含在浏览器自带的开发工具之中。以
Chrome 浏览器的“开发者工具”(Developer
Tools)为例,可以使用下面三种方法的打开它。
按 F12 或者Control + Shift + i(PC)/
Command + Option + i(Mac)。
浏览器菜单选择“工具/开发者工具”。
在一个页面元素上,打开右键菜单,选择其中的“Inspect Element”。
打开开发者工具以后,顶端有多个面板。
Elements:查看网页的 HTML 源码和 CSS 代码。
Resources:查看网页加载的各种资源文件(比如代码文件、字体文件
CSS 文件等),以及在硬盘上创建的各种内容 ...
编程风格
概述
“编程风格”(programming
style)指的是编写代码的样式规则。不同的程序员,往往有不同的编程风格。
有人说,编译器的规范叫做“语法规则”(grammar),这是程序员必须遵守的;而编译器忽略的部分,就叫“编程风格”(programming
style),这是程序员可以自由选择的。这种说法不完全正确,程序员固然可以自由选择编程风格,但是好的编程风格有助于写出质量更高、错误更少、更易于维护的程序。
所以,编程风格的选择不应该基于个人爱好、熟悉程度、打字量等因素,而要考虑如何尽量使代码清晰易读、减少出错。你选择的,不是你喜欢的风格,而是一种能够清晰表达你的意图的风格。这一点,对于
JavaScript 这种语法自由度很高的语言尤其重要。
必须牢记的一点是,如果你选定了一种“编程风格”,就应该坚持遵守,切忌多种风格混用。如果你加入他人的项目,就应该遵守现有的风格。
缩进
行首的空格和 Tab 键,都可以产生代码缩进效果(indent)。
Tab 键可以节省击键次数,但不同的文本编辑器对 Tab
的显示不尽相同,有的显示四个空格,有的显示两个空格,所以有人觉得,空格 ...
错误处理机制
Error 实例对象
JavaScript
解析或运行时,一旦发生错误,引擎就会抛出一个错误对象。JavaScript
原生提供Error构造函数,所有抛出的错误都是这个构造函数的实例。
12var err = new Error('出错了');err.message // "出错了"
上面代码中,我们调用Error()构造函数,生成一个实例对象err。Error()构造函数接受一个参数,表示错误提示,可以从实例的message属性读到这个参数。抛出Error实例对象以后,整个程序就中断在发生错误的地方,不再往下执行。
JavaScript
语言标准只提到,Error实例对象必须有message属性,表示出错时的提示信息,没有提到其他属性。大多数
JavaScript
引擎,对Error实例还提供name和stack属性,分别表示错误的名称和错误的堆栈,但它们是非标准的,不是每种实现都有。
message:错误提示信息
name:错误名称(非标准属性)
stack:错误的堆栈(非标准属性)
使用name和message这两个属 ...
数据类型的转换
概述
JavaScript
是一种动态类型语言,变量没有类型限制,可以随时赋予任意值。
1var x = y ? 1 : 'a';
上面代码中,变量x到底是数值还是字符串,取决于另一个变量y的值。y为true时,x是一个数值;y为false时,x是一个字符串。这意味着,x的类型没法在编译阶段就知道,必须等到运行时才能知道。
虽然变量的数据类型是不确定的,但是各种运算符对数据类型是有要求的。如果运算符发现,运算子的类型与预期不符,就会自动转换类型。比如,减法运算符预期左右两侧的运算子应该是数值,如果不是,就会自动将它们转为数值。
1'4' - '3' // 1
上面代码中,虽然是两个字符串相减,但是依然会得到结果数值1,原因就在于
JavaScript 将运算子自动转为了数值。
本章讲解数据类型自动转换的规则。在此之前,先讲解如何手动强制转换数据类型。
强制转换
强制转换主要指使用Number()、String()和Boolean()三个函数,手动将各种类型的值,分别转换成数字、字符串或者布尔值。
Numbe ...
其他运算符,运算顺序
void 运算符
void运算符的作用是执行一个表达式,然后不返回任何值,或者说返回undefined。
12void 0 // undefinedvoid(0) // undefined
上面是void运算符的两种写法,都正确。建议采用后一种形式,即总是使用圆括号。因为void运算符的优先性很高,如果不使用括号,容易造成错误的结果。比如,void 4 + 7实际上等同于(void 4) + 7。
下面是void运算符的一个例子。
123var x = 3;void (x = 5) //undefinedx // 5
这个运算符的主要用途是浏览器的书签工具(Bookmarklet),以及在超级链接中插入代码防止网页跳转。
请看下面的代码。
123456<script>function f() { console.log('Hello World');}</script><a href="http://example.com" onclick="f(); ret ...
二进制位运算符
概述
二进制位运算符用于直接对二进制位进行计算,一共有7个。
二进制或运算符(or):符号为|,表示若两个二进制位都为0,则结果为0,否则为1。
二进制与运算符(and):符号为&,表示若两个二进制位都为1,则结果为1,否则为0。
二进制否运算符(not):符号为~,表示对一个二进制位取反。
异或运算符(xor):符号为^,表示若两个二进制位不相同,则结果为1,否则为0。
左移运算符(left
shift):符号为<<,详见下文解释。
右移运算符(right
shift):符号为>>,详见下文解释。
头部补零的右移运算符(zero filled right
shift):符号为>>>,详见下文解释。
这些位运算符直接处理每一个比特位(bit),所以是非常底层的运算,好处是速度极快,缺点是很不直观,许多场合不能使用它们,否则会使代码难以理解和查错。
有一点需要特别注意,位运算符只对整数起作用,如果一个运算子不是整数,会自动转为整数后再执行。另外,虽然在
JavaScript
内部,数值都是以64位浮点数的形式储存,但是 ...
布尔运算符
概述
布尔运算符用于将表达式转为布尔值,一共包含四个运算符。
取反运算符:!
且运算符:&&
或运算符:||
三元运算符:?:
取反运算符(!)
取反运算符是一个感叹号,用于将布尔值变为相反值,即true变成false,false变成true。
12!true // false!false // true
对于非布尔值,取反运算符会将其转为布尔值。可以这样记忆,以下六个值取反后为true,其他值都为false。
undefined
null
false
0
NaN
空字符串('')
12345678910!undefined // true!null // true!0 // true!NaN // true!"" // true!54 // false!'hello' // false![] // false!{} // false
上面代码中,不管什么类型的值,经过取反运算后,都变成了布尔值。
如果对一个值连续做两次取反运算,等于将其转为对应的布尔值,与Boolean函数的作用相同。 ...