Typescriptの基本型とJavaScriptとの比較

TypeScript のデータ型と JavaScript との比較

## 無料学習の推奨事項: JavaScriptビデオ チュートリアル

記事ディレクトリ

TypeScript データ型と JavaScript との比較
• はじめに
• 1. データ型と基本データ型
• 1. データ型
  • 2. 基本データ型
  • 3. 両方の関係
  • 4. 例
2. リテラルと変数
• 1.リテラル
  2. 変数
  • 3. 例
  • 4. テンプレート リテラル
  ##3. JavaScript データ型
##4. TypeScript データ型
• 5. TypeScript と JavaScript のデータ型の比較
• 概要

はじめに

---

この記事では、 TypeScript のデータ型と JavaScript のデータ型 基本的なデータ型とは何ですか?それはデータ型とどのように関係するのでしょうか? TypeScript データ型と JavaScript データ型を比較す​​る比較表をリストします。

ヒント: 以下はこの記事の本文であり、以下のケースは参考用です。

---

1. データ型と基本データ型

1. データ型

データ型は、実際にはプログラミング言語に組み込まれたデータ構造です。独自の組み込みデータ構造にはそれぞれ独自の特性があります。これらは他のデータ構造を構築するために使用されます。

2. 基本データ型

基本型（基本値、基本データ型）とは、オブジェクトでもオブジェクトでもないデータの一種です。メソッド (ただし、JavaScript にはラップされたオブジェクトの基本型があり、オブジェクトにもメソッドがあります。たとえば、基本データ型である数値のラップされたオブジェクト Number は、数値を処理できるカプセル化されたオブジェクトです)。ほとんどの場合、基本型は最低レベルの言語実装を直接表します。すべてのプリミティブ型の値は不変です。ただし、注意する必要があるのは、基本型自体と、基本型に割り当てられる変数の違いです。変数には新しい値が割り当てられ、配列、オブジェクト、関数のように元の値を変更することはできません。

3. 2 つの関係

それらの間の関係は、データ型が基本データ型のスーパーセットであるということです。

4. 例

JavaScript の基本データ型の値は不変です。以下は例です:

// 使用字符串方法不会改变一个字符串var bar = "bar" //值"bar"是string类型，是js中基础数据类型console.log(bar);// bazbar.toUpperCase();console.log(bar);// baz//值"bar"本身不会改变，赋值行为可以给变量bar赋予一个新值基本类型的值"BAR"，而不是改变它。bar = bar.toUpperCase();console.log(bar);// BAR// 数组也是一种数据类型，但是使用数组方法可以改变一个数组，因此不是基本数据类型var foo = [];console.log(foo);               // []foo.push("plugh");console.log(foo);               // ["plugh"]

2. リテラルと変数

1. リテラル

リテラルは、定義された文法式で構成されます定数; または、特定の単語で構成される言語表現によって定義される定数。 JavaScriptではさまざまなリテラルを使用できます。これらのリテラルは変数ではなく、スクリプト内で文字通り与えられる固定値です。 (注釈: リテラルは値が固定されており、プログラム スクリプトの実行中に変更できない定数です。)

2. 変数

アプリケーションでは、変数を値の記号名として使用します。変数の名前は識別子とも呼ばれ、特定の規則に従う必要があります。 JavaScript 識別子は文字、アンダースコア (_)、またはドル記号 ($) で始まる必要があり、後続の文字には数字 (0 ～ 9) を使用することもできます。 JavaScript 言語では大文字と小文字が区別されるため、文字には「A」から「Z」までの大文字と、「a」から「z」までの小文字を使用できます。

#JavaScript リテラル代入変数の例:

//变量var anyname//var num是变量 = 1是number类型的字面量var num = 1/**
*	javascrip中各种数据类型的字面量赋值
*///1.数组字面量(Array literals)var animal = ["dog","cat","mouse"]//2.布尔字面量 (Boolean literals)var isTrue = truevar isTrue = false//3.整数 (Integers)var num =0 //117 and -345 (十进制, 基数为10)var num = 015 //0001 and -0o77 (八进制, 基数为8)var num = 0x1123 //0x00111 and -0xF1A7 (十六进制, 基数为16或"hex")var num = 0b11 //0b0011 and -0b11 (二进制, 基数为2)//4.浮点数字面量 (Floating-point literals)var pi = 3.14var decimals = -.2345789 // -0.23456789var decimals = -3.12e+12  // -3.12*1012var decimals = .1e-23    // 0.1*10-23=10-24=1e-24//5.对象字面量 (Object literals)function say(name){
	console.log("Hello",name)}var obj = {name:"World!",hello:say}obj.hello(obj.name) // Hello World//6.字符串字面量 (String literals)var foo = "foo"var bar = 'bar'var multiline = "one line \
				another line "

4. テンプレート リテラル

ES2015/ES6 では、テンプレートテンプレート文字列は、文字列の構築に役立つ構文糖を提供します。これは、Perl、Python、Shell、およびその他の言語の文字列補間機能に非常に似ています。さらに、テンプレート文字列を渡す前にタグを追加して、テンプレート文字列の解析プロセスをカスタマイズできます。これを使用して、インジェクション攻撃を防止したり、高度な文字列ベースのデータ抽象化を確立したりできます。 以下は例です:

// String interpolation 字符串插值 使用 `xxx ${插值变量}`var name = "World"var str = `Hello ${name}`console.log(str)// Multiline strings`In JavaScript this is
 not legal.`

3. JavaScript データ型

JavaScript は、弱い型指定または動的言語です。つまり、変数の型を事前に宣言する必要はなく、プログラムの実行中に型が自動的に決定されます。これは、同じ変数を使用して異なるタイプのデータを保存できることも意味します。まず、JavaScript のデータ型を紹介します。

最新の ECMAScript 標準では、8 つのデータ型が定義されています:

1.七种基本数据类型:

1.Boolean(布尔值):有2个值分别是(true 和 false).
2.null:一个表明 null 值的特殊关键字。 JavaScript 是大小写敏感的，因此 null 与 Null、NULL或变体完全不同。
3.undefined:和 null 一样是一个特殊的关键字，undefined 表示变量未赋值时的属性。
4.Number(数字)，整数或浮点数，例如：42 或者3.14159。
5.BigInt(任意精度的整数) ( 在 ES2020 中新添加的类型)，可以安全地存储和操作大整数，甚至可以超过数字的安全整数限制。
6.String(字符串)，字符串是一串表示文本值的字符序列，例如：“Howdy” 。
7.Symbol(在 ES6/ES2015 中新添加的类型).。一种实例是唯一且不可改变的数据类型。

2.引用类型:

1.对象(Object)、数组(Array)、函数(Function)，数组，函数是对象的一种

虽然这些数据类型相对来说比较少，但是通过他们你可以在程序中开发有用的功能。对象（Objects）和函数（functions）是这门语言的另外两个基本元素。你可以把对象当作存放值的一个命名容器，然后将函数当作你的程序能够执行的步骤。

四、TypeScript的数据类型

TypeScript几乎支持所有的JavaScript的数据类型，也有特定的数据类型比如枚举，Any,Void,Never等。也就是说TypeScript的数据类型是JavaScript的一个超集。TypeScript通过在JavaScript的基础上添加静态类型定义构建而成。TypeScript通过TypeScript编译器或Babel转译为JavaScript代码，可运行在任何浏览器，任何操作系统。

1.除了JavaScript七种基本数据类型，还有以下:

1.enum(枚举):是对JavaScript标准数据类型的一个补充像C#等其它语言一样，使用枚举类型可以为一组数值赋予友好的名字。默认情况下，从0开始为元素编号。

例子:

//枚举enum Color {Red, Green, Blue}let c: Color = Color.Green;console.log(c) // 1//你也可以手动的指定成员的数值。 例如，我们将上面的例子改成从 1开始编号：enum Color {Red = 1, Green, Blue}let c: Color = Color.Green;console.log(c) // 2//枚举类型提供的一个便利是你可以由枚举的值得到它的名字。 例如，我们知道数值为2，但是不确定它映射到Color里的哪个名字，我们可以查找相应的名字：enum Color {Red = 1, Green, Blue}let colorName: string = Color[2];console.log(colorName);  // 显示'Green'因为上面代码里它的值是2

2.any:有时候，我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容，比如来自用户输入或第三方代码库。 这种情况下，我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量。

例子:

//anylet notSure: any = 4;notSure = "maybe a string instead";notSure = false; // okay, definitely a boolean

在对现有代码进行改写的时候，any类型是十分有用的，它允许你在编译时可选择地包含或移除类型检查。 你可能认为 Object有相似的作用，就像它在其它语言中那样。 但是 Object类型的变量只是允许你给它赋任意值 - 但是却不能够在它上面调用任意的方法，即便它真的有这些方法：

例子:

let notSure: any = 4;notSure.ifItExists(); // okay, ifItExists might exist at runtimenotSure.toFixed(); // okay, toFixed exists (but the compiler doesn't check)let prettySure: Object = 4;prettySure.toFixed(); // Error: Property 'toFixed' doesn't exist on type 'Object'.//当你只知道一部分数据的类型时，any类型也是有用的。 比如，你有一个数组，它包含了不同的类型的数据：：let list: any[] = [1, true, "free"];list[1] = 100;值是2

3.void:某种程度上来说，void类型像是与any类型相反，它表示没有任何类型。 当一个函数没有返回值时，你通常会见到其返回值类型是 void

例子:

function warnUser(): void {
    console.log("This is my warning message");}//声明一个void类型的变量没有什么大用，因为你只能为它赋予undefined和null：let unusable: void = undefined;

4.never:never类型表示的是那些永不存在的值的类型。 例如， never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型； 变量也可能是 never类型，当它们被永不为真的类型保护所约束时。
never类型是任何类型的子类型，也可以赋值给任何类型；然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。 即使 any也不可以赋值给never。

例子:

//下面是一些返回never类型的函数：// 返回never的函数必须存在无法达到的终点function error(message: string): never {
    throw new Error(message);}// 推断的返回值类型为neverfunction fail() {
    return error("Something failed");}// 返回never的函数必须存在无法达到的终点function infiniteLoop(): never {
    while (true) {
    }}

5.Tuple:元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。 比如，你可以定义一对值分别为 string和number类型的元组。

例子:

// Declare a tuple typelet x: [string, number];// Initialize itx = ['hello', 10]; // OK// Initialize it incorrectlyx = [10, 'hello']; // Error//当访问一个已知索引的元素，会得到正确的类型：console.log(x[0].substr(1)); // OKconsole.log(x[1].substr(1)); // Error, 'number' does not have 'substr'//当访问一个越界的元素，会使用联合类型替代：x[3] = 'world'; // OK, 字符串可以赋值给(string | number)类型console.log(x[5].toString()); // OK, 'string' 和 'number' 都有 toStringx[6] = true; // Error, 布尔不是(string | number)类型

五、TypeScript与JavaScript数据类型对照比

null✅ ✅bigint✅✅文字列✅✅シンボル✅✅✅✅ ✅✅✅✅✅✅❌ # #Array❌ (js ではありません) ✅ (ts ではありません)##✅##enum#❌無効❌✅概要上記の例では、JavaScript と TypeScript のデータ型と基本的なデータ型を紹介し、変数とリテラルの量を簡単に紹介します。 ES6/ES2015 の新機能テンプレート リテラル; 最後に、JavaScript と TypeScript のデータ型をまとめた比較表があります。 # 関連する無料学習の推奨事項: (ビデオ)

#データ型	JavaScript	TypeScript	基本型かどうか
##✅
✅
✅
✅##✅		ブール値	##✅
✅	##番号
	未定義
	オブジェクト
		#✅	✅
# #タプル(タプル[])	#❌	##✅
❌✅	✅		##任意の
## ✅✅
✅✅		決して	#❌
✅
		javascript

以上がTypescriptの基本型とJavaScriptとの比較の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。