JavaScript&TypeScript学习总结

JavaScript&TypeScript

一.1、JavaScript语言特点

1.1、JavaScript是基于对象和事件驱动的(动态的)
　　它可以直接对用户或客户输入做出响应，无须经过Web服务程序。它对用户的响应，是采用以事件驱动的方式进行的。所谓事件驱动，就是指在主页中执行了某种操作所产生的动作，就称为“事件”。比如按下鼠标，移动窗口，选择菜单等都可以视为事件。当事件发生后，可能会引起相应的事件响应。

1.2、JavaScript是跨平台的
　　JavaScript是依赖于浏览器本身的，与操作系统无关。

一.2、JavaScript变量

2.1、定义变量
　　在定义变量时，统一使用"var 变量名"表示，例如：var str;甚至可以省略var这个关键字

2.2、JavaScript变量的类型如何决定
　　JavaScript中变量的数据类型是由JS引擎决定的

1 var name=“sanjiu”;//name是string类型
2 var age=24;//age是number类型
3 var flag=true;//flag是boolean类型
4 var email;//email只是声明，没有赋值，因此代表的类型是"undefined"，也就是无法确定
5 name=10;//name自动变成了number类型
2.3、使用typeof关键字查看变量代表的具体数据类型
　　typeof 运算符有一个参数，即要检查的变量或值。例如：

1 var sTemp = “test string”;
2 alert (typeof sTemp); //输出 “string”
3 alert (typeof 86); //输出 “number”
对变量或值调用typeof运算符将返回下列值之一：
undefined - 如果变量是 Undefined 类型的
boolean - 如果变量是 Boolean 类型的
number - 如果变量是 Number 类型的
string - 如果变量是 String 类型的
object - 如果变量是一种引用类型或 Null 类型的

一.3、JavaScript数据类型

JavaScript包含两种不同数据类型：基本数据类型和引用数据类型。基本类型指的是简单的数据，引用类型指由多个值构成的对象。当我们把值赋值给一个变量时，解析器首先要做的就是确认这个值是基本类型值还是引用类型值。

3.1、基本数据类型
常见的五种基本数据类型：
Boolean
Number
String
Undifined
Null
这五种基本数据类型可以直接操作保存在变量中的实际值。

3.1.1、字符串类型(String)
JavaScript中的字符串String一个特殊的基本数据类型，在很多语言中，String是以对象的形式表示的，但在JavaScript里，String是当作一种基本数据类型，是通值传递的方式来操作。但它是一个比较特殊的基本类型。
因为String是可以任意长度的，通过值传递，一个一个的复制字节显示效率依然很低，看起来String也可以当作引用类型。
可以这样讲，String实际上并不符合上面两种数据类型分类。它是具有两方面属性介于两都之间的一种特殊类型。

3.1.2、Null 类型
　　Null类型只有一个专用值 null，值 undefined 实际上是从值 null 派生来的，因此 ECMAScript 把它们定义为相等的。

3.1.3、Undefined 类型
　　Undefined 类型只有一个值，即 undefined。当声明的变量未初始化时，该变量的默认值是 undefined。
3.2、引用数据类型
　　javascript引用数据类型是保存在堆内存中的对象，JavaScript不允许直接访问堆内存空间中的位置和操作堆内存空间，只能通过操作对象在栈内存中的引用地址。所以引用类型的数据，在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存在堆内存中的对象。
　　一般而言，基本数据类型是由固定数目的字节组成，这些字节可以在解析器的较底层进行操作，比如Number和 Boolean；而引用数据类型，可以包含任意数目的属性和元素，因此它们无法像基本数据类型那样很容易的操作。由于，引用数据类型的值是会发生变化的， 所以通过跟基本数据类型一样的值传递方式，也就没什么意义了，因为会牵涉到大量的内存的复制和比较，效率太低。所以引用数据类型是通过引用传递方式，实际传递的只是对象的一个地址。比如Array和Function，因为它们都是特殊的对象所以它们都是引用类型。另外，引用类型是可以添加属性，基本类型虽然也可以添加属性，也不会报错，经测试添加完之后却是无法访问的。

一.4、函数

1.函数定义
函数是一种方法，封装特定功能的代码。

2.函数分类
函数的本质区别在与函数的调用方式：
如果使用new调用一个函数，那么这个函数可以理解为构造函数 例如：new Object（）。
如果使用（）来调用，这个函数可以理解为普通函数 例如：add（）。
不管是什么函数，在内存中都存在两块空间，一块表示该函数本身另一块表示函数的原型

构造函数
用于实例化对象，或者是为对象提供公共的方法。[对象可以调用构造函数原型中的方法]
为了区分普通函数，构造函数的首字母大写： Object Array
普通函数
普通函数的函数名首字母小写
3.创建函数
3.1.1函数声明
3.1.2函数表达式
函数本质上就是一个特殊的值，这个值和普通对象一样，创建于堆区，函数名中保存的实际是这个函数的引用地址。
3.1.3函数名(实参) 调用完成后返回 函数的返回值
new函数名(实参) 任务当前函数为构造函数，调用完成后会返回一个新对象

二 TypeScript

ts 基于 js，只是额外提供了一层类型系统 —— 当我们遇到看似 ts 独有的特性时，可以思考这种 ts 特性在编译之后是如何用 js 实现的呢？

二.1.TypeScript 数据类型

any(任意类型)、
never （never类型表示的是那些永不存在的值的类型） 、
void（void类型像是与any类型相反、只能为它赋予undefined和null）
针对于对象类型的： interface
针对于数组的：number[] 、string[] 、boolean[] 等， 泛型的写法：Array<元素类型> (Array)
函数的注解
布尔（Boolean）：只有true和false两种取值。

二.2 Type Script函数

调用函数：function_name（）
返回返回值：function function_name（）：return_type{
return value}

二.3Type Script类

TypeScript 是面向对象的 JavaScript。类描述了所创建的对象共同的属性和方法。TypeScript 支持面向对象的所有特性，比如 类、接口等。定义类的关键字为 class，后面紧跟类名，类可以包含以下几个模块（类的数据成员）：

字段 − 字段是类里面声明的变量。字段表示对象的有关数据。

构造函数 − 类实例化时调用，可以为类的对象分配内存。

方法 − 方法为对象要执行的操作

接口
类可以实现接口，使用关键字 implements，并将 interest 字段作为类的属性使用。
总结
通过学习JavaScript和Typescript，发现这两种语言的共同之处还是很多的，两者互有优点，，Typescript是JavaScript 的 一个超集，扩展了JavaScript 的 语法。 优势 ： 一、Angular2框架 的 的 JavaScript库，由谷歌维护，用来协助单一页面应用程序运行。 Angular2就是用 Typescript 写 。大多数的第三方库都可提供给 ts 的类型定义文件，完全支持 es6 规范。