乐趣区

关于typescript:TypeScript-字符串类型

jiezi

字符串申明

同 JavaScript 语言中一个，在 TypeScript 中咱们也能够通过单引号 '' 或者双引号 "" 来申明一个字符串类型的变量。

示例：
let str1:string = 'xkd';
let str2:string = "侠课岛";

console.log(str1);
console.log(str2);

这其实和 JavaScript 中的字符串类型差不多，TypeScript 中。

字符串新个性

TypeScript 中的字符串类型和 JavaScript 中的字符串根本相似，然而相较于 JavaScript，TypeScript 中的字符串类型新增了一些新的个性。TypeScript 中字符串的新个性有如下三种：

  • 多行字符串。
  • 字符串模板。
  • 主动拆分字符串。

多行字符串

首先是多行字符串，传统的 JavaScript 字符串换行须要应用 + 进行拼接，否则会报错。

示例：

咱们来上面这段看 JavaScript 代码：

var str = "aaa" + 
"bbb";

console.log(str);  // aaabbb

将其中的 + 去掉，代码会报错：

var str = "aaa
bbb";

console.log(str);  // SyntaxError: Invalid or unexpected token

而在 TypeScript 中则不须要应用 + 拼接，咱们能够应用 “ 双撇号（键盘左上角的那个按键）将字符串包起来，这样就能够间接实现换行。将下面的代码改写成 TypeScript 代码：

let str = `aaa
bbb`;
console.log(str);

咱们在终端执行 tsc test.ts 命令，将上述 TypeScript 代码编译成 JavaScript 代码，会主动生成一个换行符 \n：

var str = "aaa\nbbb";
console.log(str);

而后执行这段代码，输入后果如下：

aaa
bbb

字符串模板

TypeScript 中能够在多行字符串里引入一个表达式插入变量或一个办法的调用。

示例：

看上面这段 JavaScript 代码：

var username = "侠课岛";
var getName = function (){return "大侠";} 

console.log("你好:" + username);
console.log("你好:" + getName());

咱们能够通过字符串模板，将这段代码改写成如下所示 TypeScript 代码：

let username:string = "侠课岛";
let getName = function (){return "大侠";} 

console.log(` 你好:${username}`);
console.log(` 你好:${getName()}`);

主动拆分字符串

当咱们用字符串模板去调用一个办法时，字符串模板表达式中的值就会主动赋值给被调用办法中的参数。

示例：

咱们来看上面这段代码：

function test(template, name, age) {console.log(template);  
    console.log(name);      // name 就是 ${myName}
    console.log(age);       // age 就是 ${getAge()}
  }
  
  var myName = "Iven";
  var getAge = function () {return 22;}
  
// 通过字符串模板的形式，能够实现字符串的拆分
test` 我叫 ${myName}, 往年 ${getAge()} 岁了 `;

将上述代码编译成 JavaScript 代码：

var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {if (Object.defineProperty) {Object.defineProperty(cooked, "raw", { value: raw}); } else {cooked.raw = raw;}
    return cooked;
};
function test(template, name, age) {console.log(template);
    console.log(name); // name 就是 ${myName}
    console.log(age);  // age 就是 ${getAge()}
}
var myName = "Iven";
var getAge = function () {return 22;};
// 通过字符串模板的形式，能够实现字符串的拆分
test(__makeTemplateObject(["\u6211\u53EB", ",\u4ECA\u5E74", "\u5C81\u4E86"], ["\u6211\u53EB", ",\u4ECA\u5E74", "\u5C81\u4E86"]), myName, getAge());

输入：

['我叫', ', 往年', '岁了']
Iven
22
退出移动版