Typescript - 变量类型
<h2>原文：TypeScript基本知识点整理</h2><p> </p>
<h2>一、number</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let num1 : number = 20;
let num2 : number = 175.5;
let a1 : number = Infinity; //正无穷大
let a2 : number = -Infinity; //负无穷小
let a3 : number = NaN;
</pre>
</div>
<p> <span style="font-size: 16px"> 这和 js 一样，Infinity、-<span style="font-size: 16px">Infinity</span>、NaN 也是属于 Number 类型的；</span></p>
<p> </p>
<h2>二、undefined</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let un : undefined = undefined;
</pre>
</div>
<p><span style="font-size: 16px"> 在 ts 中，undefined 也是单独的数据类型，如上。需要注意的是，<span style="font-size: 16px">undefined类型的变量不能被赋值成其他类型，“undefined 类型的数据只能被赋值为 undefined”。</span></span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">// 报错，不能编译
let un: undefined;
un = 5;
</pre>
</div>
<p> </p>
<h2>三、null</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let nu : null = null;
</pre>
</div>
<p><span style="font-size: 16px"> 同上，null 类型的变量只能赋值为 nul。</span></p>
<p><span style="font-size: 16px"> null 是一个空指针对象， undefined 是未初始化的变量，所以可以把 <span style="font-size: 16px">undefined 看成一个空变量， 把 null 看成一个空对象。</span><br></span></p>
<blockquote>
<p><span style="font-size: 16px"><span style="font-size: 16px">特别注意：在 ts 中， null 和 undefined 类型，是所有其他类型的子类型，即，这哥俩可以被赋值给所有其他类型，并且被赋值后在赋值原来数据类型的数据不会报错...</span></span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">// 不会报错，成功编译
var un = 5;
un = null;
un = 6;
</pre>
</div>
</blockquote>
<p> </p>
<h2>四、string 类型</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">//值类型
let str : string = '你好！'
//引用类型
let str1 : String = new String('你好！')
</pre>
</div>
<p> </p>
<h2>五、boolean 类型</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let boo : boolean = true;
let boo1 : boolean = false
</pre>
</div>
<p> </p>
<h1>六、symbol 类型（js 在 es6 版本拓展的新的基础数据类型）</h1>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let sy : symbol = Symbol('bar');
</pre>
</div>
<p><span style="font-size: 16px"> 和 js 一样，构造这个数据类型的时候只能通过</span><span style="font-size: 16px">如上的 Symbol 构造函数创建。</span></p>
<p> </p>
<h2>七、数组 类型</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">//字面量
let arr1 : number[] =
//泛型---->相当于数组中每个元素的类型
let arr2 : Array<string> = ['a', 's']
//构造函数
let arr3 : string[] = new Array('a', 's')
//联合类型-->这里的联合类型的意思是，数组中元素的类型可以是number 或 string，两种都有也可以
let arr4 : Array<number | string> =
</pre>
</div>
<p> </p>
<h2>八、元组 类型(tuple)</h2>
<p><span style="font-size: 16px"> 这是 ts 特有的数据类型，先看示例：</span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let tup : = ['asdasd', 43233];
</pre>
</div>
<p><span style="font-size: 16px"> 初看上去，和数组看起来有点类似，但是，是由区别的：元组类型有长度限制，并且每一个位置上的数据类型一一对应，如上例中 tup 数组长度只能是 2，且 tup 必须是 string 型，tup 必须是 number 型，<span style="color: rgba(255, 0, 0, 1)">这三点是区别于数组的联合类型的地方</span>。</span></p>
<p> </p>
<h2>九、枚举 类型(enum)</h2>
<p><span style="font-size: 16px"> 枚举类型是个蛋碎一地的类型，这里只记录常用的，研究细节还请移步：Typescript - 枚举；<br></span></p>
<h3>数字枚举：</h3>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">enum REN {
// nan = 1 ----->初始化下标
nan,
nv,
yao
}
console.log(REN.nan)//0
console.log(REN.nv)//1
console.log(REN.yao)//2
//使用数字枚举时，TS 会为枚举成员生成反向映射
console.log(REN)// yao
</pre>
</div>
<p><span style="font-size: 16px"> 当然，数字枚举的下标默认从 0 开始，也可以自行设置成员的初始值，他们会自行递增。</span></p>
<h3>字符串枚举：</h3>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">enum SIJI {
chun = '春',
xia = '夏',
qiu = '秋',
dong = '冬'
}
console.log(SIJI.chun)//春
console.log(SIJI.xia)//夏
console.log(SIJI.qiu)//秋
console.log(SIJI.dong)//冬
</pre>
</div>
<p><span style="font-size: 16px"> 字符串枚举不支持成员自增长，每个成员必须要初始化，且字符串枚举不会为成员生成反向映射。</span></p>
<h2> </h2>
<h2>十、void 类型</h2>
<p><span style="font-size: 16px"> 表示没有返回值，一般用于方法（function）中。</span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">// es 5
function fn() : void {
console.log('...')
}
// es6
() : void => {
console.log('...')
}
</pre>
</div>
<p><span style="font-size: 16px"> 这里，我们也可以指定函数的返回值为 undefined。因为在 js 中，如果函数没有返回值，则会默认返回 undefined。不过，使用 void 类型可以使表意更清晰。</span></p>
<p> </p>
<h2>十一、 any 类型</h2>
<p><span style="font-size: 16px"> any 类型是一个最通用的类型，其他类型都是 any 的子类型，因此，any 类型可以被赋值成任何类型的值。</span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let an : any = 'any 类型';
console.log(an)//any 类型
an = 25;
console.log(an)//25
</pre>
</div>
<p> </p>
<p><span style="font-size: 16px"> 关于 any 有两点需要注意：</span></p>
<p><span style="font-size: 16px"> 1）如果在声明变量时，没有声明其类型，也没有初始化，那么在 ts 做类型推断的时候会被判断成 any 类型。<br></span></p>
<p><span style="font-size: 16px"> 2）在 any 类型上可以访问任何属性，即使这个属性对于某些数据类型不存在：</span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let something: any = 42
something.mayExist() // 没问题，因为其可能在运行时存在
something.toFixed() // 没问题，虽然确实存在，但是编译器并不会去检查
</pre>
</div>
<p> </p>
<h2>十二、never 类型</h2>
<p><span style="font-size: 16px"> never 类型表示永远不会存在的值的类型，常用于描述函数。never 是任何类型的子类型，never 没有子类型，即 never 是最后一层，因此，never 型的数据只能被赋值成 never 型。</span></p>
<p><span style="font-size: 16px"> </span></p>
<h3>never 类型通常用于两种情况：</h3>
<h4>1.用来描述抛出错误的函数：</h4>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">function fn(msg : string) : never {
throw new Error(msg)
}
</pre>
</div>
<h4> 2.函数中存在无法到达的终点，如死循环：</h4>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">function fn() : never {
while (true) {
// do something
}
}
</pre>
</div>
<p> </p>
<h2>十三、日期 类型</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let da : Date = new Date()
console.log(da)
</pre>
</div>
<p> </p>
<h2>十四、正则 类型</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">//构造函数声明法
let reg1 : RegExp = new RegExp('ljy','gi')
console.log(reg1)
//字面量的声明法
let reg2 : RegExp = /ljy/gi
console.log(reg2)
</pre>
</div>
<p> </p><br><br>
来源：https://www.cnblogs.com/cc-freiheit/p/10634520.html
頁:
[1]