# JavaScript

# 背景理论

要真正学好用好JavaScript，理解其本质、历史及局限性是非常重要的

JavaScript包含几个部分：

核心（ECMAScript）宿主环境提供ECMAScript的基准实现和与环境自身交互必需的扩展。扩展(比如DOM)使用ECMAScript核心类型和语法，提供特定于环境的额外功能。
文档对象（DOM）DOM通过创建表示文档的树，让开发者可以随心所欲地控制网页的内容和结构。使用DOM API，可以轻松地删除、添加、替换、修改节点。能做到不刷新页面而修改页面外观和内容。
浏览器对象模型（BOM）用于支持访问和操作浏览器的窗口。

JavaScript是通过<script>元素插入到HTML页面中。这个元素可用于把JavaScript代码嵌入到HTML页面中，跟其他标记混合在一起，也可用于引入保存在外部文件中的JavaScript代码。<script>元素的一个最为强大、同时也备受争议的特性是，它可以包含来自外部域的JavaScript文件

# 语言基础

标识符数字、字母、下划线(_)和美元符号($)，相较于Python多了个$
变量是松散类型可用于保存任何类型的数据，重用 const let来定义
数据类型 6 种简单数据类型(也称原始类型)，可用操作符 typeof 来检测
- Undefined类型取值undefined，如let message; 假值
- Null类型取值null，如let car = null; 假值
- Boolean类型取值true和false
- Number类型取值范围Number.MIN_VALUE到Number.Max_VALUE，特殊值NaN，转换函数parseInt和parseFloat
- String类型可使用单引号(')、双引号(")或反引号(`)标示，如 let firstName = 'linda';
- Symbol类型
对象是一组数据和功能的集合。对象通过new操作符后跟对象类型的名称来创建，如 let o = new Object();
操作符用于操作数据值
- 一元操作符 age++
- 逻辑操作符取反(同时使用两个!!,相当于调用了转型函数Boolean())，逻辑与逻辑或如 let myObject = preferredObject || backupObject; 短路特性
- 关系运算符 == ===
- 条件运算符 variable = boolean_expression ? true_value : false_value;
- 赋值操作符 let num = 10; num *= 20;
- 逗号操作符号 let num1 = 1, num2 = 2, num3 = 3;
语句 if for 语句 break continue

if (i > 25){
    console.log('xxx');
} else {
    console.log('yyy');
}

for (const propName in window){
    document.write(propName);
}

# 基本引用类型

对象被认为是某个特定引用类型的实例。新对象通过使用new操作符后跟一个构造函数(constructor)来创建。构造函数就是用来创建新对象的函数，如 let now = new Date();

let value = "25";
let number = Number(value); // 转型函数
console.log(typeof number); // "number"

let obj = new Number(value);// 构造函数
console.log(typeof obj);    // "object"

# 集合引用类型

# Object

虽然Object的实例没有多少功能，但很适合存储和在应用程序间交换数据

方式一

let person = new Object();
person.name = "linda";
person.age = 20;

方式二推荐

let person = {
    name: "linda",
    age: 20
};

# Array

一组有序数据
每个槽位可以存储任意类型的数据
动态大小，随着数据添加而自动增长

let colors = ["red", "blue", "green"];

colors.length           // 3, 长度
Array.isArray(colors);  // true, 检测是否是数组

// 迭代 keys()、values()、entries()
for (const [idx, element] of colors.entries()) {
    console.log(idx, element);
}

colors.toString()   // red,blue,green
colors.join("||")   // red||blue||green

// 栈方法
colors.push("orange");
colors.pop();

// 队列方法
colors.shift();
colors.unshift("orange");

// 排序方法 原地排
colors.sort() 

// 最强大 splice

// indexOf(item), lastIndexOf(item), 没有返回-1

// 迭代方法 every filter forEach map some
colors.forEach((item, idnex, array) => {
    // 执行某些操作
})

# 函数

函数实际上是对象，每个函数都是Function类型的实例，函数名就是指向函数对象的指针，而且不一定与函数本身紧密绑定

function sum (num1, num2) {
    return num1 + num2;
}

let sum = (num1, num2) => {
    return num1 + num2;
};

ECMAScript函数既不关心传入的参数个数，也不关心这些参数的数据类型。参数可通过内部arguments类数组来访问