JavaScript进阶教程：Cookie基础与字符串处理详解

Cookie基础与应用场景

本节内容聚焦于一个实用且有趣的Web技术：Cookie。Cookie主要用于存储访问者相关信息，例如记录用户姓名以便在用户再次访问时显示欢迎语。此外，Cookie还可用于保存客户端环境特征，比如根据网络连接速度自动调整发送的图片数量以优化加载体验。

在合理且不侵犯用户隐私的前提下，Cookie具有极高的实用价值。为了深入理解Cookie的工作机制，我们需要先掌握两个JavaScript基础知识点：字符串处理技巧以及相关数组操作。

字符串处理：Cookie的数据基础

为何在探索Cookie之前必须先掌握字符串处理？因为Cookie本质上就是字符串。要保存用户信息，首先需要构建特定的Cookie字符串；当用户再次访问时，系统需读取并解码该字符串。生成和解析这些字符串依赖于对JavaScript字符串工作原理的深入理解，因此这是必要的前置知识。如果你是初学者，建议先阅读JavaScript初级教程第二课，参考以下示例：

var normal_monkey = "I am a monkey!<br>";

document.writeln("Normal monkey " + normal_monkey);

var bold_monkey = normal_monkey.bold();

document.writeln("Bold monkey " + bold_monkey);

上述代码中的关键声明如下：

var bold_monkey = normal_monkey.bold();

该声明等价于以下字符串拼接方式：

var bold_monkey = "<b>" + normal_monkey + "</b>";

第一种写法更为简洁。这里使用了字符串对象提供的bold方法，其他常用的字符串对象方法还包括indexOf、charAt、substring和split，它们允许开发者深入操作字符串内部结构。接下来我们将重点研究indexOf方法。

查找子字符串：indexOf方法

indexOf

indexOf方法用于查找子字符串在父字符串中的起始位置，并返回该索引值。如果未找到指定的子字符串，该方法将返回-1。具体示例如下：

var the_word = "monkey";

我们以单词“monkey”作为基础字符串进行演示。

var location_of_m = the_word.indexOf("m");

变量location_of_m（字母m的位置）结果为0，因为“m”位于字符串的起始索引位置。接着查找字母“o”：var location_of_o = the_word.indexOf("o");，其结果location_of_o为1。

var location_of_key = the_word.indexOf("key");

变量location_of_key（子字符串“key”的位置）结果为3，因为“key”以字母“k”开头，而“k”在“monkey”中的索引位置正是3。

var location_of_y = the_word.indexOf("y");

变量location_of_y（字母“y”的位置）结果为5。

var cheeky = the_word.indexOf("q");

变量cheeky的值为-1，因为在单词“monkey”中不存在字母“q”。

indexOf的更实用场景示例：

var the_email = prompt("What's your email address?", "");

var the_at_is_at = the_email.indexOf("@");

if (the_at_is_at == -1)

alert("You loser, email addresses must have @ signs in them.");

这段代码首先通过prompt询问用户输入电子邮件地址，然后检查其中是否包含“@”符号。如果indexOf返回-1（即不包含“@”），则弹出警告提示用户：“你输入的电子邮件地址无效，电子邮件的地址必须包含字符@。”

提取特定字符：charAt方法

charAt

charAt方法用于获取字符串中指定索引位置的单个字符。具体示例如下：

var the_word = "monkey";

var the_first_letter = the_word.charAt(0);

var the_second_letter = the_word.charAt(1);

var the_last_letter = the_word.charAt(the_word.length-1);

变量the_first_letter（第1个字符）的值为“m”。

变量the_second_letter（第2个字符）的值为“o”。

变量the_last_letter（最后一个字符）的值为“y”。

需要注意的是，利用字符串的length属性可以获取字符串包含的字符总数。在本例中，the_word为“monkey”，其length值为6。由于字符串索引从0开始，最后一个字符的索引位置即为length-1。因此，在获取最后一个字符时，代码使用了the_word.length-1作为参数。