TypeScript 里 string 和 String，真不是仅仅是大小写的区别

本文分享自华为云社区《TypeScript里string和String的区别》，作者：gentle_zhou 。

背景

与 JavaScript 语言不同的是，TypeScript 使用的是静态类型，比如说它指定了变量可以保存的数据类型。如下图所示，如果在 JS 中，指定变量可以保存的数据类型，会报错：“类型注释只可以在 TS 文件中被使用”：

TypeScript 是 JavaScript 的超集（superset），TypeScript 需要编译（语法转换）生成 JavaScript 才能被浏览器执行，它也区分了 string 和 String 这两个数据类型。通常来说，string 表示原生类型，而 String 表示对象。

原生 string

JavaScript 在 ES6 标准里支持 6 种原生类型（number），string 是其中之一。

原生的 string 是不包含属性的值（即没有 properties），包括字面上没有定义类型、字面上定义了 string、字面上定义了 String 和一些从 string 函数调用返回的 strings 也都可以被归为原生类型：

以上三个变量的类型（typeof()）是 string。

对象 String

对象是不同属性的累积，一个对象可以调用许多相应的方法。let msg3: String = new String('Hello world!');

这个变量 msg3 的类型就是 object：console.log(typeof(msg3)); // object

String 对象支持的方法：

代码对比

我们对下面 4 个变量进行类型的探索与比较：

let msg: string = 'Hello world!';let msg2: String = 'Hello world!';let msg22 = 'Hello world!';  //字面上没有定义类型let msg3: String = new String('Hello world!');
console.log(typeof(msg));  //stringconsole.log(typeof(msg2));  //stringconsole.log(typeof(msg22));  //stringconsole.log(typeof(msg3));  //objectconsole.log(msg === msg2);  //trueconsole.log(msg === msg3);  //falseconsole.log(msg2 === msg3);  //false

为什么需要 String 对象

首先，当我们使用关键字 new 新建一个 String 对象的时候，TS 会创建一个新的对象；即我们用 new 新建了两个 String 对象，即使内容相同，它们也是指向不同的内存。举下面两个栗子：

1. 当用 a1,b1 代表相同值的两个变量的时候，它们是相同的；而当用 new 新建两个对象的时候，即使值相同，它们也是不同的（下图会输出false, true）：

1. eval()函数的作用：用来计算表达式的值。如果我们把 eval()直接赋给 string，而 string 里面是计算式的字符串，那么它会返回计算后的值；而如果我们把 eval()赋给 String，因为它不是原生类型，它只会返回 String 这个对象（下图会输出27， :"8 + 20"， 28）：

其次，因为 String 对象可以有属性。我们可以用 String 对象在属性里保留一个额外的值。即使这个用法并不常见，但是仍然是 TS 的一个特性：

var prim = 'hello HW';var obj = new String('hello HW Cloud');
prim.property = 'PaaS'; // Invalidobj.property = 'PaaS';  // Validconsole.log(obj.property); //输出为PaaS

两者区别总结

参考链接

1. https://www.geeksforgeeks.org/what-is-the-difference-between-string-and-string-in-typescript/?ref=lbp

2. https://www.geeksforgeeks.org/variables-datatypes-javascript/

3. https://www.tutorialspoint.com/typescript/typescript_strings.htm

点击关注，第一时间了解华为云新鲜技术~​