第 1 章 JavaScript简介

  • 使用 Node.js 搭建 Web 服务器
npm install http-server -g
http-server
  • JavaScript 的类型有数字、字符串、布尔值、函数和对象。还有 undefined 和 null ,以及数组、日期和正则表达式。

  • 操作符

.cnblogs-markdown table th:nth-child(1){
width:150px;
}
.cnblogs-markdown table th:nth-child(2){
width:400px;
}
.cnblogs-markdown table th:nth-child(3){
width:150px;
}

算数操作符 描述
+ 加法
- 减法
* 乘法
/ 除法
% 取余
++ 递增
-- 递减
赋值操作符 描述
= 赋值
+= 加/赋值 (x += y) == (x = x + y)
-= 减/赋值 (x -= y) == (x = x - y)
*= 乘/赋值 (x *= y) == (x = x * y)
/= 除/赋值 (x /= y) == (x = x / y)
%= 取余/赋值 (x %= y) == (x = x % y)
比较操作符 描述
== 相等
=== 全等
!= 不等
> 大于
>= 大于等于
< 小于
<= 小于等于
逻辑操作符 描述
&&
||
!
位操作符 描述
&
|
~
^ 异或
<< 左移
>> 右移
  • typeof 操作符可以返回变量或表达式的类型
  • JavaScript还支持 delete 操作符,可以删除对象里的属性
数值类型 转换成布尔值
undefined false
null false
布尔值 true是 true ,false是 false
数字 +0 、 -0 和 NaN 都是 false ,其他都是 true
字符串 如果字符串是空的(长度是0)就是 false ,其他都是 true
对象 true
  • 相等操作符( == 和 === )
类型(x) 类型(y) 结 果
null undefined true
undefined null true
数字 字符串 x == toNumber(y)
字符串 数字 toNumber(x) == y
布尔值 任何类型 toNumber(x) == y
任何类型 布尔值 x == toNumber(y)
字符串或数字 对象 x == toPrimitive(y)
对象 字符串或数字 toPrimitive(x) == y
  • 如果x和y是相同类型,JavaScript会比较它们的值或对象值。其他没有列在这个表格中的情况

    都会返回 false 。
  • toNumber 和 toPrimitive 方法是内部的,并根据以下表格对其进行估值。
  • toNumber 方法对不同类型返回的结果如下:
值类型 结 果
undefined NaN
null +0
布尔值 如果是 true ,返回 1 ;如果是 false ,返回 +0
数字 数字对应的值
字符串 将字符串解析成数字。如果字符串中包含字母,返回 NaN ;如果是由数字字符组成的,转换成数字
对象 Number(toPrimitive(vale))
  • toPrimitive 方法对不同类型返回的结果如下:
值类型 结 果
对象 如果对象的 valueOf 方法的结果是原始值,返回原始值。如果对象的 toString方法返回原始值,就返回这个值;其他情况都返回一个错误
  • === 操作符,如果比较的两个值类型不同,比较的结果就是 false 。如果比较的两个值类型相同,结果会根据下表判断。
类型(x) 结 果
数字 x和y数值相同(但不是 NaN ) true
字符串 x和y是相同的字符 true
布尔值 x和y都是 true 或 false true
对象 x和y引用同一个对象 true

ECMAScript 6

  • 用 let 替代 var 声明变量
  • 常量 const PI = 3.141593;
  • 模板字面量
var name='123';
console.log(`my name is ${name}`);
  • 箭头函数
let circleArea2 = (r) => 3.14 * r * r;
  • 函数的参数默认值
function sum(x=1,y=2,z=3){
return x+y+z;
}
sum(4,6);//13
  • 声明展开和剩余参数

在ES5中,我们可以用 apply() 函数把数组转化为参数。

ES6有了展开操作符( ... )。

var params = [3, 4, 5];
console.log(sum(...params));
等价于
var params = [3, 4, 5];
console.log(sum.apply(undefined, params));

在函数中,展开操作符( ... )也可以代替 arguments ,当作剩余参数使用。

function restParamaterFunction (x, y, ...a) {
return (x + y) * a.length;
}
console.log(restParamaterFunction(1, 2, "hello", true, 7)); //输出9;
等价于
function restParamaterFunction (x, y) {
var a = Array.prototype.slice.call(arguments, 2);
return (x + y) * a.length;
};
  • 增强的对象属性

ES6引入了数组解构的概念,可以用来一次初始化多个变量

var [x,y] = ['a','b'];//初始化
[x,y] = [y,x];//值互换
  • 使用类进行面向对象编程
class Book { //{2}
constructor (title, pages, isbn) {
this.title = title;
this.pages = pages;
this.isbn = isbn;
}
printIsbn(){
console.log(this.isbn);
}
}
  1. 继承
class ITBook extends Book {
constructor (title, pages, isbn, technology) {
super(title, pages, isbn);
this.technology = technology;
}
printTechnology(){
console.log(this.technology);
}
}
let jsBook = new ITBook('学习JS算法', '200', '1234567890', 'JavaScript');
console.log(jsBook.title);
console.log(jsBook.printTechnology());
  1. 使用属性存取器
class Person {
constructor (name) {
this._name = name;
}
get name() {
return this._name;
}
set name(value) {
this._name = value;
}
}
let lotrChar = new Person('Frodo');
console.log(lotrChar.name); //{4}
lotrChar.name = 'Gandalf'; //{5}
console.log(lotrChar.name);
lotrChar._name = 'Sam'; //{6}
console.log(lotrChar.name);
  1. 其他功能

ES6还有其他一些功能,包括列表迭代器、类型数组、 Set 、 Map 、 WeakSet 、 WeakMap 、模

块、尾调用、 Symbol ,等等