JavaScript(三)——字符串常用方法

数字与字符

1. 当我们尝试添加(或连接)一个字符串和一个数字时，会发生什么?
   让我们在我们的控制台中尝试一下:

'Front ' + 242;

您可能会认为这会抛出一个错误，但它运行得很好。
试图将字符串表示为一个数字并不是很讲的通，但是用数字表示一个字符串则不然，因此浏览器很聪明地将数字转换为字符串，并将这两个字符串连接在一起。

2. 你甚至可以用两个数字来这么操作——你可以通过用引号将数字包装成一个字符串。尝试以下方法(我们使用typeof操作符来检查变量是一个数字还是一个字符串):

let myDate = '19' + '67';
typeof myDate;

3. 如果您有一个数值变量，您想要将其转换为字符串，并且不改变其他地方，或者您想将一个字符串转换为一个数字而不改变其其他地方，那么您可以使用以下两个构造:
   如果可以的话， Number 对象将把传递给它的任何东西转换成一个数字。
   试一试:

let myString = '123';
let myNum = Number(myString);
typeof myNum;

4. 另一方面，每个数字都有一个名为 toString() 的方法，它将把它转换成等价的字符串。
   试试这个:

let myNum = 123;
let myString = myNum.toString();
typeof myString;

---

获得字符串的长度

这很简单 — 你可以很轻松的使用 length 属性. 尝试输入以下的两行代码：

let browserType = 'mozilla';
browserType.length;

这个结果应该返回一个数字：7,因为"mozilla"的长度为7个字符. 说字符串的长度有用是有很多原因的, 例如，你可能想算出一连串名字的长度，并用名字长度来作为名字排序的依据，亦或让一个用户知道他输入的用户名太长，已经超出了输入的字符串长度限制。

---

检索特定字符串字符

在相关的注释中，您可以使用方括号表示法返回字符串中的任何字符 - 这意味着您可以在变量名的末尾包含方括号（[ ]）。 在方括号内，您可以包含要返回的字符的编号，例如，您要检索第一个字母，可以这样做：

browserType[0];

要检索任何字符串的最后一个字符，我们可以使用下面这行，将这种技术与我们上面看到的length属性相结合起来：

browserType[browserType.length-1];

“mozilla”的长度为7，但由于计数从0开始，所以字符位置为6，因此需要长度为 length-1。 例如，您可以使用它来查找一系列字符串的第一个字母，并按字母顺序排列。

---

在字符串中查找子字符串并提取它

1. 有时候你会想要找出一个较小的字符串是否存在于一个较大的字符串中（我们通常会说一个字符串中存在一个子字符串）。 这可以使用 indexOf() 方法来完成，该方法需要一个 parameter — 你想要搜索的子字符串。 尝试以下：

browserType.indexOf('zilla');

结果是2，因为子字符串“zilla”从“mozilla”内的位置2（0，1，2 —— 所以从第3个字符）开始。 这样的代码可以用来过滤字符串。 例如，假设我们有一个Web地址列表，但我们只想打印出包含“mozilla”的那些地址。

2. 这可以用另一种可能更有效的方式来实现。 尝试以下：

browserType.indexOf('vanilla');

这应该会得到 -1 的结果 —— 当在主字符串中找不到子字符串（在本例中为“vanilla”）时将返回 -1。

3.当你知道字符串中的子字符串开始的位置，以及想要结束的字符时，slice() 可以用来提取它。尝试如下：

browserType.slice(0,3);

这时返回"moz"——第一个参数是开始提取的字符位置，第二个参数是提取的最后一个字符的后一个位置。所以提取从第一个位置开始，直到但不包括最后一个位置。（此例中）你也可以说第二个参数等于被返回的字符串的长度。

---

转换大小写

字符串方法 toLowerCase() 和 toUpperCase() 字符串并将所有字符分别转换为小写或大写。 例如，如果要在将数据存储在数据库中之前对所有用户输入的数据进行规范化，这可能非常有用。

让我们尝试输入以下几行来看看会发生什么：

let radData = 'My NaMe Is MuD';
radData.toLowerCase();
radData.toUpperCase();

---

替换字符串的某部分

您可以使用 replace() 方法将字符串中的一个子字符串替换为另一个子字符串。在基础的层面上， 这个工作非常简单。你当然可以用它做一些更高级的事情，但目前我们不会涉及到。

它需要两个参数 - 要被替换下的字符串和要被替换上的字符串。 尝试这个例子：

browserType.replace('moz','van');

注意，在实际程序中，想要真正更新 browserType 变量的值，您需要设置变量的值等于刚才的操作结果；它不会自动更新子串的值。所以事实上你需要这样写：browserType = browserType.replace('moz','van'); 。

---

案例

大写修正

在这个练习中，我们有英国城市的名字，但是这个大写字母都搞砸了。 我们希望你改变它们，使它们都是小写字母，除了首字母。

var list = document.querySelector('.output ul');
list.innerHTML = '';
var cities = ['lonDon', 'ManCHESTer', 'BiRmiNGHAM', 'liVERpoOL'];
for(var i = 0; i < cities.length; i++) {
  var input = cities[i];
  // write your code just below here
  var small = input.slice(1);
  var large = input.slice(0, 1);
  small = small.toLowerCase();
  large = large.toUpperCase();
  var result = large + small;
  var listItem = document.createElement('li');
  listItem.textContent = result;
  list.appendChild(listItem);
}

从原先部分得到新字符串

在最后一个练习中，阵列包含一堆字符串，其中包含有关英格兰北部火车站的信息。 字符串是包含三字母站代码的数据项，后面是一些机器可读数据，后跟分号，后跟可读站名。 例如：

MAN675847583748sjt567654;Manchester Piccadilly

我们要提取站点代码和名称，并将它们放在一起，具有以下结构的字符串：

MAN: Manchester Piccadilly

var list = document.querySelector('.output ul');
list.innerHTML = '';
var stations = ['MAN675847583748sjt567654;Manchester Piccadilly',
                'GNF576746573fhdg4737dh4;Greenfield',
                'LIV5hg65hd737456236dch46dg4;Liverpool Lime Street',
                'SYB4f65hf75f736463;Stalybridge',
                'HUD5767ghtyfyr4536dh45dg45dg3;Huddersfield'];

for (var i = 0; i < stations.length; i++) {
  var input = stations[i];
  // write your code just below here
  var id = input.slice(0, 3);
  var index = input.indexOf(':');
  var name = input.slice(index+1);
  var result = id + '：' + name;
  var listItem = document.createElement('li');
  listItem.textContent = result;
  list.appendChild(listItem);
}