本文首发自「慕课网」,想理解更多IT干货内容,程序员圈内热闻,欢送关注!
作者| 慕课网精英讲师 Lison
这篇文章咱们理解一下 JavaScript 中现有的八个数据类型,当然这并不是 JavaScript 中的所有数据类型,而是当初版本的 TypeScript 反对的根本类型,在学习根底类型之前,咱们先来看下如何为一个变量指定类型:为一个变量指定类型的语法是应用"变量: 类型"的模式,如下:let num: number = 123如果你没有为这个变量指定类型,编译器会主动依据你赋给这个变量的值来推断这个变量的类型:let num = 123
num = 'abc' // error 不能将类型“"123"”调配给类型“number”当咱们给num赋值为123但没有指定类型时,编译器推断出了num的类型为number数值类型,所以当给num再赋值为字符串"abc"时,就会报错。这里还有一点要留神,就是number和Number的区别:TS中指定类型的时候要用number,这个是TypeScript的类型关键字。而Number为JavaScript的原生构造函数,用它来创立数值类型的值,它俩是不一样的。包含你前面见到的string、boolean等都是TypeScript的类型关键字,不是JavaScript语法,这点要辨别开。接下来咱们来看下,这八个JS中你见过的类型。2.1.1 布尔类型类型为布尔类型的变量的值只能是 true 或 false,如下:
let bool: boolean = false;
bool = true;
bool = 123; // error
不能将类型"123"调配给类型"boolean"当然了,赋给 bool 的值也能够是一个计算之后后果是布尔值的表达式,比方:let bool: boolean = !!0
console.log(bool) // false2.1.2 数值类型TypeScript 和 JavaScript 一样,所有数字都是浮点数,所以只有一个number类型,而没有int或者float类型。而且 TypeScript 还反对 ES6 中新增的二进制和八进制数字字面量,所以 TypeScript 中共反对二、八、十和十六四种进制的数值。let num: number;
num = 123;
num = "123"; // error 不能将类型"123"调配给类型"number"
num = 0b1111011; // 二进制的123
num = 0o173; // 八进制的123
num = 0x7b; // 十六进制的1232.1.3 字符串字符串类型中你能够应用单引号和双引号包裹内容,然而可能你应用的 tslint 规定会对引号进行检测,应用单引号还是双引号能够在 tslint 规定里配置。你还能够应用 ES6 语法——模板字符串,拼接变量和字符串更为不便。let str: string = "Lison";
str = "Li";
const first = "Lison";
const last = "Li";
str = ${first} ${last}
;
console.log(str) // 打印后果为:Lison Li另外还有个和字符串相干的类型:字符串字面量类型。即把一个字符串字面量作为一种类型,比方下面的字符串"Lison",当你把一个变量指定为这个字符串类型的时候,就不能再赋值为其余字符串值了,如:let str: 'Lison'
str = 'haha' // error 不能将类型“"haha"”调配给类型“"Lison"”2.1.4 数组在 TypeScript 中有两种定义数组的形式:let list1: number[] = [1, 2, 3];
let list2: Array<number> = [1, 2, 3];第一种模式通过number[]的模式来指定这个类型元素均为number类型的数组类型,这种写法是举荐的写法,当然你也能够应用第二种写法。留神,这两种写法中的number指定的是数组元素的类型,你也能够在这里将数组的元素指定为任意类型。如果你要指定一个数组里的元素既能够是数值也能够是字符串,那么你能够应用这种形式:number|string[],这种形式咱们在前面学习联结类型的时候会讲到。当你应用第二种模式定义时,tslint 可能会正告让你应用第一种模式定义,如果你就是想用第二种模式,能够通过在 tslint.json 的 rules 中退出"array-type": [false]敞开 tslint 对这条的检测。前面咱们讲接口的时候,还会讲到数组的一个非凡类型:ReadonlyArray,即只读数组。2.1.5 null 和 undefinednull 和 undefined 有一些独特特点,所以咱们放在一起讲。说它们有独特特点,是因为在 JavaScript 中,undefined 和 null 是两个根本数据类型。在 TypeScript 中,这两者都有各自的类型即 undefined 和 null,也就是说它们既是理论的值,也是类型,来看理论例子:let u: undefined = undefined;// 这里可能会报一个tslint的谬误:Unnecessary initialization to 'undefined',就是不能给一个值赋undefined,但咱们晓得这是能够的,所以如果你的代码标准想让这种代码合理化,能够配置tslint,将"no-unnecessary-initializer"设为false即可
let n: null = null; 默认状况下 undefined 和 null 能够赋值给任意类型的值,也就是说你能够把 undefined 赋值给 void 类型,也能够赋值给 number 类型。当你在 tsconfig.json 的"compilerOptions"里设置了"strictNullChecks": true时,那必须严格看待。undefined 和 null 将只能赋值给它们本身和 void 类型,void类型咱们前面会学习。2.1.6 objectobject 在 JS 中是援用类型,它和 JS 中的其余根本类型不一样,像 number、string、boolean、undefined、null 这些都是根本类型,这些类型的变量存的是他们的值,而 object 类型的变量存的是援用,看个简略的例子:let strInit = "abc";
let strClone = strInit;
strClone = "efg";
console.log(strInit); // 'abc'
let objInit = { a: "aa" };
let objClone = objInit;
console.log(objClone) // {a:"aa"}
objInit.a = "bb";
console.log(objClone); // { a: 'bb' }通过例子能够看出,咱们批改 objInit 时,objClone 也被批改了,是因为 objClone 保留的是 objInit 的援用,实际上 objInit 和 objClone 是同一个对象。当咱们心愿一个变量或者函数的参数的类型是一个对象的时候,应用这个类型,比方:let obj: object
obj = { name: 'Lison' }
obj = 123 // error 不能将类型“123”调配给类型“object”这里有一点要留神了,你可能会想到给 obj 指定类型为 object 对象类型,而后给它赋值一个对象,前面通过属性拜访操作符拜访这个对象的某个属性,实际操作一下你就会发现会报错:let obj: object
obj = { name: 'Lison' }
console.log(obj.name) // error 类型“object”上不存在属性“name”这里报错说类型 object 上没有 name 这个属性。如果你想要达到这种需要你应该应用咱们前面章节要讲到的接口,那 object 类型适宜什么时候应用呢?咱们后面说了,当你心愿一个值必须是对象而不是数值等类型时,比方咱们定义一个函数,参数必须是对象,这个时候就用到object类型了:function getKeys (obj: object) {
return Object.keys(obj) // 会以列表的模式返回obj中的值
}
getKeys({ a: 'a' }) // ['a']
getKeys(123) // error 类型“123”的参数不能赋给类型“object”的参数这里你要明确object类型的应用。2.1.6 symbolSymbol 是 ES6 退出的新的根底数据类型,因为它的常识比拟多。本节小结本篇文章咱们总结了八个在JavaScript中咱们就见过的数据类型,它们是:布尔类型、数值类型、字符串、数组、null、undefined、object以及ES6中新增的symbol。在TypeScript中它们都有对应的类型关键字,对应关系为:布尔类型:boolean数值类型:number字符串类型:string数组:Array<type>或type[]对象类型:objectSymbol类型:symbolnull和undefined:null 和 undefined,这个比拟非凡,它们本身即是类型这些类型是根底,咱们前面的高级类型很多都是它们的组合或者变形,所以肯定要把这些根底先学会。
欢送关注「慕课网」,发现更多IT圈优质内容,分享干货常识,帮忙你成为更好的程序员!