JavaScript 注释语句操作

注释的代码块在JavaScript之中是不会运行的。注释是一个非常好的方式让你自己以及其他人明白这段代码是怎么运行的。

JavaScript中的注释方式有以下两种：

使用//来告诉JavaScript来忽略当前行的代码

// This is an in-line comment.

你也可以使用多行注释来注释你的代码，以/*开始，用*/来结束，就像下面这样：

/* This is a

multi-line comment */

最佳实践

你应该给你写的代码添加注释，来让你的代码看起来更加地清晰易懂。良好的注释能够清晰地传达你写的代码的意图—对于那些读你的代码的人来说以及未来你看到它的时候，还能理解这段代码的意图。

声明JavaScript变量

在计算机科学中,data(数据)就是一切，因为它对于计算机的意义重大。JavaScript提供七种不同的data types(数据类型)，它们是undefined（未定义）,null（空）,boolean（布尔型）,string（字符串）,symbol(符号),number（数字）, andobject（对象）。

举个栗子, 计算机能够分辨不同的数字, 例如数字12和strings，”12″和”dog”, 或”123 cats”, 都是字母的集合。 计算机能够精确地操作数字， 但是对于字符串却无能为力。

Variables（变量）允许计算机以一种动态的形式来存储和操作数据，通过操作指向数据的指针而不是数据本身来避免了内存泄露，以上的七种数据类型都可以存储到一个变量（variable）中。

Variables非常类似于你在数学中使用的x,y变量, 这意味着它们都是以一个简单命名的名字来代替我们赋值给它的数据。计算机中的variables（变量）与数学中的变量不同的是，计算机可以在不同的时间存储不同类型的变量。

通过在变量的前面使用关键字var，我们告诉 JavaScript 来创建或者declare（声明）一个变量,就像这样：

var ourName;

上面代码的意思是创建一个名为ourName的variable（变量），在JavaScript中我们使用分号来结束一段声明。

Variable（变量）的名字可以由数字、字母、$或者_组成，但是不能包含空格或者以数字为首。

任务

使用var关键字来创建一个名为myName的变量。

提示

如果遇到困难了，请看下ourName的例子是怎么写的。

// 举例

var ourName;

var myName;

// Define myName below this line

JavaScript 使用=为变量赋值

在JavaScript中，你可以通过assignment(分配)操作符把一个值存储到变量中。

myVariable = 5;

把Number数字5赋给变量myVariable。

赋值过程是从右到左进行的。所有=操作符右边的值都会被赋到左边的变量。

myVar = 5;

myNum = myVar;

数值5被赋给变量myVar中， 然后变量myVar又赋给变量myNum，这样子myNum变量中的值也是5了。

任务

把数值7赋给变量a。

把变量a中的内容赋给变量b。

// Setup

var a;

var b = 2;

// Only change code below this line

a=7;

b=a;

JavaScript 使用=为变量赋初始值

通常地我们会在initialize开始声明变量的时候就会给变量赋一个初始值。

var myVar = 0;

创建一个名为myVar的变量并指定一个初始值0。

任务

通过关键字var定义一个变量a并且给它一个初始值9。

// 举例

var ourVar = 19;

// Only change code below this line

var a=9;

理解JavaScript未定义变量

当 JavaScript 中的变量被声明的时候，程序内部会给它一个初始值undefined。当你对一个值为undefined的变量进行运算操作的时候，算出来的结果将会是NaN，NaN的意思是”Not a Number”。当你用一个没有定义的变量来做字符串连接操作的时候，它会如实的输出”undefined”。

任务

定义3个变量a、b、c，并且分别给他们赋值：5、10、”I am a”，这样它们就不会是undefined（未定义的了）。

// Initialize these three variables

var a=5;

var b=10;

var c=”I am a”;

// Do not change code below this line

a = a + 1;

b = b + 5;

c = c + ” String!”;

理解JavaScript变量的大小写敏感性

在 JavaScript 中所有的变量都是大小写敏感的。这意味着你要区别对待大写字母和小写字母。

MYVAR与MyVar和myvar是截然不同的变量。这就有可能导致多个截然不同的变量却有着有相似的名字。正是由于以上原因所以强烈地建议你,不要使用这一特性。（以免给自己带来麻烦）

最佳实践

使用驼峰命名法来书写一个 Javascript 变量，在驼峰命名法中，变量名的第一个单词的首写字母小写，后面的单词的第一个字母大写。

举个栗子:

var someVariable;

var anotherVariableName;

var thisVariableNameIsTooLong;

任务

修正声明的变量，让它们的命名符合驼峰命名法的规范。

// Declarations

var studlyCapVaR;

var properCamelCase;

var titleCaseOver;

// Assignments

studlyCapVar = 10;

properCamelCase = “A String”;

titleCaseOver = 9000;

JavaScript加法运算

现在让我们来尝试在JavaScript中做加法运算。

JavaScript 中使用+号来让两个数字执行加法运算。

举例

myVar = 5 + 10; // 等于 15

任务

改变数字0让变量 sum 的值为20.

var sum = 10 + 10;

JavaScript减法运算

我们也可以在 JavaScript 中执行减法运算。

JavaScript 中使用-来做减法运算。

举例

myVar = 12 – 6; // 等于 6

任务

改变数字0让变量 difference 的值为12。

var difference = 45 – 33;

JavaScript乘法运算

我们也可在 JavaScript 中使用乘法运算。

JavaScript 使用这个*符号来让两个数字相乘。

举例

myVar = 13 * 13; // assigned 169

任务

改变数值0来让变量 product 的值等于80。

var product = 8 * 10;

JavaScript除法运算

我们可以在 JavaScript 中做除法运算。

JavaScript 中使用/符号做除法运算。

举例

myVar = 16 / 2; // assigned 8

任务

改变数值0来让变量quotient的值等于2

var quotient = 66 / 33;

JavaScript自增运算++

使用++，我们可以很容易地对变量进行自增或者+1运算。

i++;

等效于

i = i + 1;

提示

i++;这种写法，省去了书写=符号的必要。

任务

重写代码，使用++来对变量myVar进行自增操作。

var myVar = 87;

// Only change code below this line

myVar++;

JavaScript自减运算–

使用自减符号–，你可以很方便地对一个变量执行自减或者减一操作。

i–;

等效于

i = i – 1;

提示

i–;这种写法，省去了书写等号的必要。

任务

重写代码，使用–符号对myVar执行自减操作。

var myVar = 87;

// Only change code below this line

myVar–;

JavaScript浮点数

我们也可以把小数存储到变量中。小数也被称作浮点数。

提示

不是所有的实数都可以用浮点数来表示。因为可能存在四舍五入的错误，详情在这儿。

任务

创建一个变量myDecimal并给它复制一个浮点数。 (e.g.5.7)。

var ourDecimal = 5.7;

// Only change code below this line

var myDecimal=5.7;

JavaScript小数乘法运算

在 JavaScript 中，你也可以用小数进行计算，就像整数一样。

让我们把两个小数相乘，并得到它们相乘的结果（product）。

任务

改变0.0的数值让变量product的值等于5.0。

var product = 2.0 * 2.5;

JavaScript小数的除法运算

现在让我们来用一个小数做除法操作。

任务

改变数值0.0的值让变量quotient的值等于2.2.

var quotient = 4.4 / 2.0;

JavaScript取余运算%

现在我们用%运算符来取余。

举例

5 % 2 = 1

用法

在数学中，看一个数是奇数还是偶数，只需要看这个数除以2得到的余数是0还是1。

17 % 2 = 1 (17 is 奇数)

48 % 2 = 0 (48 is 偶数)

任务

使用%操作符，计算11除以3剩下的余数，并把余数赋给变量remainder。

// Only change code below this line

var remainder=11%3;

JavaScript +=赋值操作

在编程当中，通常通过赋值来修改变量的内容。请记住，先计算=右边，然后把计算出来的结果赋给左边。

myVar = myVar + 5;

以上是最常见的运算赋值语句，先运算、再赋值。

还有一类操作符是一步到位既做运算也赋值的。

这类操作符的其中一种就是+=运算符。

myVar += 5;也是把数值5加到变量myVar上。

任务

使用+=操作符实现同样的效果。

var a = 3;

var b = 17;

var c = 12;

// Only modify code below this line

a += 12;

b += 9;

c += 7;

JavaScript -=赋值操作

与+=操作符类似，-=操作符用来对一个变量进行减法赋值操作。

myVar = myVar – 5;

将会从变量myVar中减去数值5。也可以写成这种形式：

myVar -= 5;

任务

使用-=操作符实现同样的效果。

var a = 11;

var b = 9;

var c = 3;

// Only modify code below this line

a -= 6;

b -= 15;

c -= 1;

JavaScript *=赋值操作

*=操作符是让变量与一个数相乘并赋值。

myVar = myVar * 5;

将会把变量myVar与数值5相乘。也可以写作这样的形式:

myVar *= 5;

任务

使用*=操作符实现同样的效果。

var a = 5;

var b = 12;

var c = 4.6;

// Only modify code below this line

a *=5;

b *= 3;

c *= 10;

JavaScript /=赋值操作

/=操作符是让变量与另一个数相除并赋值。

myVar = myVar / 5;

会把变量myVar的值除于5。等价于:

myVar /= 5;

任务

使用/=操作符实现同样的效果。

var a = 48;

var b = 108;

var c = 33;

// Only modify code below this line

a /= 12;

b /= 4;

c /= 11;

JavaScript 基本预算综合练习

为了测试你的学习效果，我们来做一个摄氏度转华氏度的小应用。

从Celsius摄氏度转换为Fahrenheit华氏度的算法是：摄氏度的温度乘于9除于5，再加上32。

创建一个变量fahrenheit，然后计算出摄氏度对应的华氏度。

function convert(celsius) {

// Only change code below this line

fahrenheit=celsius*9/5+32;

// Only change code above this line

return fahrenheit;

}

// Change the inputs below to test your code

convert(30);

JavaScript 声明字符串变量

先前我们使用过的代码：

var myName = “your name”;

“your name”被称作字符串。 字符串是用单或双引号包裹起来的一连串的零个或多个字符。

任务

创建两个新的字符串变量：myFirstName和myLastName分别为它们赋上你的姓和名的值。

// 举例

var firstName = “Alan”;

var lastName = “Turing”;

// Only change code below this line

var myFirstName=”wnag”;

var myLastName=”zhao”;

JavaScript 转义字符串中的引号

当你定义一个字符串必须要用单引号或双引号来包裹它。那么当你需要在字符串中使用一个:”或者’时该怎么办呢?

在 JavaScript 中，你可以通过在引号前面使用反斜杠(\) 来转义引号。

var sampleStr = “Alan said, \”Peter is learning JavaScript\”.”;

这标志着提醒 JavaScript 单引号或双引号并不是字符串的结尾，而是出现在字符串内的字符。所以，如果你要打印字符串到控制台，你将得到：

Alan said, “Peter is learning JavaScript”.

任务

使用反斜杠将一个字符串赋值给变量myStr，以便如果你要打印到控制台，你会看到：

I am a “double quoted” string inside “double quotes”

var myStr; // Change this line

myStr=”I am a \”double quoted\” string inside \”double quotes\””;

JavaScript 使用单引号引用字符串

在 JavaScript 中的字符串要用单引号或双引号来包裹它，只要你在开始和结束都使用相同类型的引号，单引号和双引号的功能在JavaScript中是相同的。

“This string has \”double quotes\” in it”

当我们需要在字符串中使用与开头结尾相同的引号时，我们需要对引号进行转义。如果你有很多双引号的字符串，使用转义字符可能导致难以阅读。这时候可以使用单引号。

‘This string has “double quotes” in it. And “probably” lots of them.’

任务

更改myStr字符串的双引号为单引号，并移除转义符号。

var myStr = ‘Link‘;

JavaScript 转义字符串中的特殊符号

字符串中的转义序列

引号不是字符串中唯一的可以被转义字符。下面是常见的转义序列列表:

CodeOutput

\ ‘单引号

\ “双引号

\\反斜杠符

\ n换行符

\ r回车符

\ t制表符

\ b退格符

\ f换页符

注意，如果你想要显示一个反斜杠就必须要转义它。

任务

按照下面的顺序，并且用空格来分割：

反斜杠 制表符 退格符 回车符 换行符并把它赋值给变量myStr

var myStr; // Change this line

myStr=’\\ \t \b \r \n’;

JavaScript字符串连接方式

在 JavaScript 中，当+操作符与字符串一起使用的时候，它被称作连接操作符。你可以通过和其他字符串连接来创建一个新的字符串。

举个例子

‘My name is Alan,’ + ‘ I concatenate.’

注意

当心空格。连接操作不会添加两个字符串之外的空格，所以想加上空格的话，你需要自己在字符串里面添加。

任务

使用+操作，把字符串”This is the start. “和”This is the end.”连接起来并赋值给变量myStr。

// 举例

var ourStr = “I come first. ” + “I come second.”;

// Only change code below this line

var myStr= “This is the start. “+ “This is the end.”;

JavaScript +=连接字符串操作

我们还可以使用+=运算符来连接字符串到现有字符串的结尾。对于那些非常长的字符串来说，这一操作是非常有用的。

注意

当心空格。连接操作不会添加两个字符串外面的空格，所以如果想要加上空格的话，你需要自己在字符串里面添加。

任务

通过使用+=操作符来连接这两个字符串:

“This is the first sentence. “和”This is the second sentence.”并赋给变量myStr。

// 举例

var ourStr = “I come first. “;

ourStr += “I come second.”;

// Only change code below this line

var myStr=”This is the first sentence. ” ;

myStr+=”This is the second sentence.” ;

JavaScript 使用变量连接字符串

有时候你需要创建一个填字风格的字符串。

通过使用连接运算符+，你可以插入一个或多个变量来组成一个字符串。

任务

把你的名字赋值给变量myName，然后把变量myName插入到字符串”My name is “和” and I am swell!”之间，并把连接后的结果赋值给变量myStr。

// 举例

var ourName = “Free Code Camp”;

var ourStr = “Hello, our name is ” + ourName + “, how are you?”;

// Only change code below this line

var myName=”wang”;

var myStr= “My name is ” +myName+”and I am swell!”;

JavaScript 追加变量到字符串上

我们不仅可以创建出多行的字符串，还可以使用加等号(+=)运算符来追加变量到字符串上。

任务

设置变量someAdjective的值，并使用+=运算符把它追加到变量myStr上。

// 举例

var anAdjective = “awesome!”;

var ourStr = “Free Code Camp is “;

ourStr += anAdjective;

// Only change code below this line

var someAdjective=”wangzhaoyang”;

var myStr = “Learning to code is “;

myStr+=someAdjective;

JavaScript 获取字符串的长度

你可以通过在字符串变量或字符串后面写上.length来获得字符串变量字符串值的长度。

“Alan Peter”.length; // 10

例如，我们创建了一个变量var firstName = “Charles”，我们就可以通过使用firstName.length来获得”Charles”字符串的长度。

任务

使用.length属性来获得变量lastName的长度，并把它赋值给变量lastNameLength。

// 举例

var firstNameLength = 0;

var firstName = “Ada”;

firstNameLength = firstName.length;

// Setup

var lastNameLength = 0;

var lastName = “Lovelace”;

// Only change code below this line.

lastNameLength = lastName.length;

JavaScript 使用中括号获取字符串中的第一个字符

[]叫中括号，{}叫大括号，()叫小括号。

JavaScript中只有字符串类型，没有字符类型。那么如何获取到字符串中的某个字符呢？

我们通过[索引]来获得对应的字符。

大多数现代编程语言，如JavaScript，不同于人类从1开始计数。它们是从0开始计数，这被称为基于零的索引。

例如, 在单词 “Charles” 中索引0上的字符为 “C”，所以在var firstName = “Charles”中，你可以使用firstName[0]来获得第一个位置上的字符。

任务

使用[索引]来得到变量lastName中的第一个字符，并赋给变量firstLetterOfLastName。

提示

如果你遇到困难了，不妨看看变量firstLetterOfFirstName是如何赋值的。

// 举例

var firstLetterOfFirstName = “”;

var firstName = “Ada”;

firstLetterOfFirstName = firstName[0];

// Setup

var firstLetterOfLastName = “”;

var lastName = “Lovelace”;

// Only change code below this line

firstLetterOfLastName = lastName[0];

理解JavaScript字符串的不可变性

理解字符串的不可变性！当你搞懂不可变性后immutable.js对于你就是小菜一碟了。

在 JavaScript 中，字符串的值是不可变的，这意味着一旦字符串被创建就不能被改变。

例如，下面的代码：

var myStr = “Bob”;

myStr[0] = “J”;

是不会把变量myStr的值改变成 “Job” 的，因为变量myStr是不可变的。注意，这并不意味着myStr永远不能被改变，只是字符串字面量string literal的各个字符不能被改变。改变myStr中的唯一方法是重新给它赋一个值，就像这样：

var myStr = “Bob”;

myStr = “Job”;

任务

把myStr的值改为Hello World。

// Setup

var myStr = “Jello World”;

// Only change code below this line

myStr = “Hello World”; // Fix Me

JavaScript 使用中括号索引查找字符串中的第N个字符

你也可以使用[索引]来获得一个字符串中的其他位置的字符。

请记住，程序是从0开始计数，所以获取第一个字符实际上是[0]。

任务

让我们使用[索引]，把lastName变量的第三个字符赋值给thirdLetterOfLastName。

提示

如果你遇到困难了，看看secondLetterOfFirstName变量是如何做的。

// 举例

var firstName = “Ada”;

var secondLetterOfFirstName = firstName[1];

// Setup

var lastName = “Lovelace”;

// Only change code below this line.

var thirdLetterOfLastName = lastName[2];

JavaScript 使用中括号索引查找字符串中的最后一个字符

为了得到一个字符串的最后一个字符，你可以用[字符串的长度减去一]。

例如，在var firstName = “Charles”中，你可以这样操作firstName[firstName.length – 1]来得到字符串的最后的一个字符。

任务

使用[索引]来取得lastName变量中的最后一个字符。

提示

如果你遇到困难了，不妨看看在lastLetterOfFirstName变量上是怎么做的。

// 举例

var firstName = “Ada”;

var lastLetterOfFirstName = firstName[firstName.length – 1];

// Setup

var lastName = “Lovelace”;

// Only change code below this line.

var lastLetterOfLastName = lastName[lastName.length-1];

JavaScript 使用中括号索引查找字符串中的第N个到最后一个字符

我们既可以获取字符串的最后一个字符，也可以用获取字符串的倒数第N个字符。

例如，你可以这样firstName[firstName.length – 3]操作来获得var firstName = “Charles”字符串中的倒数第三个字符。

任务

使用[索引]来获得lastName字符串中的倒数第二个字符。

提示

如果你遇到困难了，不妨看看thirdToLastLetterOfFirstName变量是如何做到的。

// 举例

var firstName = “Ada”;

var thirdToLastLetterOfFirstName = firstName[firstName.length – 3];

// Setup

var lastName = “Lovelace”;

// Only change code below this line

var secondToLastLetterOfLastName = lastName[lastName.length-2];

Javascript 字符串操作综合训练

填词造句

现在我们将使用字符串的相关知识，来玩一个填字风格的文字游戏。

通过使用提供的变量：名词myNoun、形容词myAdjective、动词myVerb、副词myAdverb，来创建一个新的字符串result。

此外，除了所提供的词之外，你还需要添加额外的连接字符串。

我们提供了多种测试，该测试将用多个不同的输入来运行你的函数，以确保所有提供的单词和你额外添加的连接字符串能够准确输出。

function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {

var result = “”;

// Your code below this line

result=myNoun+” “+myAdjective+” “+myVerb+” “+myAdverb;

// Your code above this line

return result;

}

// Change the words here to test your function

wordBlanks(“dog”, ” big”, ” ran”, ” quickly”);

wordBlanks(“cat”, “little”, “hit”, “slowly”);

Javascript 数组操作

使用数组，我们可以在一个地方存储多个数据。

你以左方括号[开始定义一个数组，以右方括号]结束定义，并把每个条目之间用逗号隔开，就像这样：

var sandwich = [“peanut butter”, “jelly”, “bread”]。

任务

创建一个包含字符串和数字的数组myArray。

提示

如果你遇到困难，请参考文本编辑器中的示例代码。

// 举例

var array = [“John”, 23];

// Only change code below this line.

var myArray = [“josh”,22];

Javascript 多维数组操作

你也可以在数组中包含其他数组，就像这样:[[“Bulls”, 23], [“White Sox”, 45]]。这被称为一个多维数组。

// 举例

var ourArray = [[“the universe”, 42], [“everything”, 101010]];

// Only change code below this line.

var myArray = [[“Bulls”,23],[“White Sox”,45]];

JavaScript 使用索引查找数组中的数据

我们可以像操作字符串一样通过数组索引[index]来访问数组中的数据。

数组索引的使用与字符串索引一样，不同的是，通过字符串的索引得到的是一个字符，通过数组索引得到的是一个条目。与字符串类似，数组也是基于零的索引，因此数组的第一个元素的索引是0。

例如

var array = [1,2,3];

array[0]; // 等于 1

var data = array[1];// 等于 2

任务

创建一个名为myData的变量，并把myArray的第一个索引上的值赋给它。

// 举例

var ourArray = [1,2,3];

var ourData = ourArray[0]; // equals 1

// Setup

var myArray = [1,2,3];

// Only change code below this line.

var myData = myArray[0];

JavaScript 使用索引修改数组中的数据

与字符串的数据不可变不同，数组的数据是可变的，并且可以自由地改变。

例如

var ourArray = [3,2,1];

ourArray[0] = 1; // ourArray等于 [1,2,1]

任务

修改数组myArray中索引0上的值为3。

// 举例

var ourArray = [1,2,3];

ourArray[1] = 3; // ourArray now equals [1,3,3].

// Setup

var myArray = [1,2,3];

// Only change code below this line.

myArray[0]=3;

JavaScript 使用索引操作多维数组

可以把多维数组看作成是一个数组中的数组。当使用[]去访问数组的时候，第一个[index]访问的是第N个子数组，第二个[index]访问的是第N个子数组的第N个元素。

例如

var arr = [

[1,2,3],

[4,5,6],

[7,8,9],

[[10,11,12], 13, 14]

];

arr[0]; // 等于 [1,2,3]

arr[1][2]; // 等于 6

arr[3][0][1]; // 等于 11

任务

对数组myArray使用[index]操作使得 myData 的值为8