一、JavaScript 学习总结
1.什么是JavaScript
JavaScript是一种用来编写脚本的编程语言，它们可以被直接写在网页的 HTML中，在页面加载的时候自动执行，通常我们在html文件底部的<script>进行代码的编写。
2.基本语法
（1）大小写敏感
（2）标识符
就是指变量、函数、属性的名字，或者函数的参数。标识符可以是按照下列格式规则组合起来的一或多个字符:
注意：
1）第一个字符只能是字母、下划线（ _ ）或美元符号（ $ ）之一；
2） 其他字符可以是字母、下划线、美元符号或数字。
3）按照惯例，ECMAScript（European Computer Manufacturers Association） 标识符采用 驼峰大 小写格式，也就是第一个字母小写，剩下的每个单词的首字母大写，如getNameById
（3）注释
- 单行注释：以
//开头 - 多行注释：以
/*开头，*/结尾
（4）语句
语句后的分号可以添加，也可以不添加，建议添加
（5）关键字/保留字
在 JavaScript 中，一些标识符是保留关键字，不能用作变量名或函数名，或者说是 JavaScript 语言内部预备使用的一组名字（或称为命令）。这些名字目前还没有具体的用途，是为 JavaScript 升级版本预留备用的，建议用户不要使用。
（6）变量
ECMAScript 的变量是松散类型的，所谓松散类型就是可以用来保存任何类型（如： String、Number、Boolean以及Object等）的数据。换句话说，每个变量仅仅是一个用于保存值的占位符而已。
定义变量时要使用 var 操作符，后跟变量名（即一个标识符），如下所示： var message; 这行代码定义了一个名为 message 的变量，该变量可以用来保存任何值。
注意：
即用 var 操作符定义的变量将成为定义该变量的作用域中的局部变量。也就是说，如果在函数中使用 var 定义一个变量，那么这个变量在函数退出后就会被销毁。
3. 操作符
（1）一元操作符++ --
（2）布尔操作符 && || ！
注意:
除下列值为假外其余皆为真： false、null、undefined、''、0、NaN
&&和||都属于 短路操作！
（3）算术操作符+ - * / %
（4）关系操作符 < > <= >= == === != !==
注意： ===称为全等（值和类型）
（5）条件（问号）操作符 ？ ：
（6）赋值操作符 = += -+ *= /= %=
4.语句
-
if do-while while for for-in for-of break continue switch
注意：
请为语句块添加 {}，不要吝啬
另外， for-of、forEach能简洁的遍历集合中的元素
5. 函数
-
函数（
function）对任何语言来说都是一个核心的概念。通过函数可以封装任意多条语句，而且可以在任何地方、任何时候调用执行。 -
ECMAScript 中的函数在定义时不必指定是否返回值。实际上，任何函数在任何时候都可以通过
return语句后跟要返回的值来实现返回值。 -
ECMAScript 函数不介意传递进来多少个参数，也不在乎传进来参数是什么数据类型。
6.对象 Object
对象 Object 是ECMAScript 中使用最多的一个类型。我们常将数据和方法封装在对象中。
创建对象的方式：
虽然 Object 构造函数或对象字面量都可以用来创建单个对象，但这些方式有个明显的缺点：使用同一个接口创建很多对象，会产生大量的重复代码。为解决这个问题，人们开始使用工厂模式的一种变体。
7. 数组 Array
除了 Object 之外， Array 类型是 ECMAScript 中最常用的类型。
ECMAScript 数组与其他语言中的数组都是数据的有序列表，但与其他语言不同的是，ECMAScript 数组的每一项 可以保存任何类型的数据。
ECMAScript 数组的大小是可以动态调整的，即可以随着数据的添加自动增长以容纳新增数据。
创建数组的方法：
（1）元素联合：
（2）栈堆方法
栈是一种 LIFO（Last-In-First-Out，后进先出）的数据结构，也就是最新添加的项最早被移除。而栈中项的插入（叫做推入）和移除（叫做弹出），只发生在一个位置——栈的顶部。
ECMAScript 为数组专门提供了 push() 和 pop() 方法，以便实现类似栈的行为。
（3）队列方法
栈数据结构的访问规则是 LIFO（后进先出），而队列数据结构的访问规则是 FIFO（First-In-First-Out，先进先出）。队列在列表的末端添加项，从列表的前端移除项。
由于 push() 是向数组末端添加项的方法，因此要模拟队列只需一个从数组前端取得项的方法。实现这一操作的数组方法就是 shift() ，它能够移除数组中的第一个项并返回该项，同时将数组长度减1。
ECMAScript 还为数组提供了一个 unshift() 方法。它能在数组前端添加任意个项并返回新数组的长度。
总结：
push、pop操作在数组末，而 unshift、shift操作在数组头；push、unshift压入而pop、shift弹出。
（4）反转数项组
（5）链接方法
（6）分片方法
slice() ，它能够基于当前数组中的一或多个项创建一个新数组。 slice() 方法可以接受一或两个参数，即要返回项的起始和结束位置。
在只有一个参数的情况下， slice() 方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数，该方法返回起始和结束位置之间的项——但不包括结束位置的项。
注意：
slice() 方法不会影响原始数组
（7）splice方法
可对数组如下3种操作：
-
删除：可以删除任意数量的项，只需指定 2 个参数：要删除的第一项的位置和要删除的项数。 例如，
splice(0,2)会删除数组中的前两项。 -
插入：可以向指定位置插入任意数量的项，只需提供 3 个参数：起始位置、0（要删除的项数） 和要插入的项。如果要插入多个项，可以再传入第四、第五，以至任意多个项。例如，
splice(2,0,'red','green')会从当前数组的位置 2 开始插入字符串 'red' 和 'green' 。 -
替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定 3 个参数：起 始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如，
splice (2,1,'red','green')会删除当前数组位置 2 的项，然后再从位置 2 开始插入字符串 'red' 和 'green' 。
8.链式语法
链式语法已变得非常流行。实际上这是一种非常容易实现的模式。基本上，你只需要让每个函数返回 this代表包含该函数的对象，这样其他函数就可以立即被调用。
9. 闭包
函数的局部变量集合，只是这些局部变量在函数返回后会继续存在。
闭包就是就是函数的“堆栈”在函数返回后并不释放，我们也可以理解为这些函数堆栈并不在栈上分配而是在堆上分配。
当在一个函数内定义另外一个函数就会产生闭包。
二、TypeScript学习总结
1. 什么是TypeScipt
- TypeScript是JavaScript类型的超集（当前我们处于ES5），它可以编译成纯JavaScript。
- TypeScript给JavaScript加上可选的类型系统，给JavaScript加上静态类型后，就能将调试从运行期提前到编码期，诸如类型检查、越界检查这样的功能才能真正发挥作用。
- TypeScript可以构建大型程序，并在任何浏览器、任何计算机和任何操作系统上运行，且是开源的。
2. TS配置
安装好NodeJS后，以管理员身份运行终端，使用npm -g install ts-node typescript命令进行全局安装
如在VS Code中开发，请安装TSLint、TypeScript Hero、Bracket Pair Colorizer等插件
新建一个.ts后缀的文件，任意写一段JS代码，点击运行试试是否配置成功。
3. let和const
不使用var，使用let或const申明变量，并加上类型说明，且作用域为块级即以{}为界
let lang: string = 'TypeScript';//如果省略类型说明，TS也可进行自动推断
let age: number = 89;
const pi: number = 3.14159;//pi以后不可改变，类似常量
4. 解构
将对象、数组中的元素拆分到指定变量中，以方便使用。
//解构数组
let input = [89, 64, 2018, 10];
let [first, second] = input;//注意使用[]
console.log(first); // 89 console.log(second); // 64
let [one, ...others] = input; //剩余变量
console.log(...others); //展开
let newArr = [89, ...others, 18];
console.log(newArr); //解构对象
let o = { a: "foo", b: 12, c: "bar" };
let {a, b} = o;//注意使用{}，且变量名需与对象中道属性名一致
console.log(a, b);
5. 函数
（1）使用完整函数类型定义
//命名函数，有完整的参数和返回类型。可以不用，TS将自动进行类型推断但推荐使用！
function add(x: number, y: number): number
{ return x + y; } //匿名函数
let myAdd = function(x: number, y: number): number { return x + y; };
console.log(myAdd(1, '2'));//error
console.log(myAdd(1));//error
console.log(typeof myAdd(1, 2));//number
（2）可选参数
//可选参数，必须放在必要参数后
function greeting(firstName: string, lastName?: string) {
if(lastName) {
return `Hello ${firstName} ${lastName}!`;
} return `Hello ${firstName}!`;
}
console.log(greeting('QiGe'));
console.log(greeting('QiGe', 'Wang'));
console.log(greeting('QiGe', 'Wang', 'Yong'));//error!
（3）默认参数
//默认参数，不必在必要参数后
function greeting(firstName: string, lastName = 'Wang') {
return `Hello ${firstName} ${lastName}!`;
}
console.log(greeting('QiGe'));
console.log(greeting('QiGe', 'HaHaHa'));
console.log(greeting('QiGe', 'HaHaHa', 'Yong'));//error!
（4）剩余参数
必要参数，默认参数和可选参数有个共同点：它们表示某一个参数。
//剩余参数，会被当做个数不限的可选参数。可以一个都没有，也可以有任意个
function greeting(firstName: string, ...restName: string[]) {
return `Hello ${firstName} ${restName.join(' ')}!`;
}
console.log(greeting('Osama', 'bin', 'Muhammad', 'bin', 'Awad', 'bin', 'Laden')); console.log(greeting('Laden'));
（5）箭头函数
特点：简化函数定义、解决this问题。
//无参数，函数体代码只有一行，则该行结果即为函数返回值
let greeting1 = () => `Hello TS!`;
console.log(greeting1());
//一个参数，函数体代码只有一行，则该行结果即为函数返回值 let greeting2 = (name: string) => `Hello ${name}`; console.log(greeting2('QiGe'));
//两个及以上的参数，函数体代码只有一行，则该行结果即为函数返回值
let add1 = (n1: number, n2: number) => n1 + n2;
console.log(add1(1, 2));
//两个及以上的参数，函数体代码多于一行,则必须用{}包裹，且显式给出return
let add2 = (n1: number, n2: number) => {
let sum = n1 + n2;
return sum;//改为sum++结果如何？
}
console.log(add2(1, 2));
（6）类class
类是属性（有些什么）和函数（能干什么）的集合，是生成对象（Object）或类实例的模板。
1）类的属性和函数的访问权限：
类中的属性和函数都有访问权限，默认为public即全局可访问，其次为protected即可在类的内部和其子类的内部可访问，最后为private，只能在该类内部可访问。
2）存取器-getter、setter
当在类外部时，建议设置getter和setter操作其private属性，即使public属性也如此。
3）静态属性
类中的属性或函数有static修饰，则可直接使用而不需要实例化.
4）继承
可以通过extends关键字继承其它类，从而成为其子类。
6. 模块
对于大型的项目，我们需要使用模块进行管理。每个 .ts 文件就是一个模块，通过 export 来对外部模块暴露元素，通过 import 来引入模块。
1399
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
