给代码添加注释
// /**/
声明变量
在计算机科学中,数据就是一切,它对于计算机意义重大。JavaScript 提供七种不同的数据类型,它们是undefined(未定义), null(空),boolean(布尔型),string(字符串),symbol(符号),number(数字),和object(对象)。
通过在变量的前面使用关键字var,声明一个变量,例如:
var ourName;
上面代码的意思是创建一个名为ourName的变量,在 JavaScript 中我们以分号结束语句。
变量名称可以由数字、字母、美元符号$或者 下划线_组成,但是不能包含空格 不能以数字为开头。
使用赋值运算符存储值
使用赋值运算符初始化变量
理解未初始化的变量
当 JavaScript 中的变量被声明的时候,程序内部会给它一个初始值undefined。
当你对一个值为undefined的变量进行运算操作的时候,算出来的结果将会是NaN,NaN的意思是"Not a Number"。
当你用一个值是undefined的变量来做字符串拼接操作的时候,它会输出字符串"undefined"。
了解变量名区分大小写
加法运算
减法运算
乘法运算
除法运算
数字递增
数字递减
创建一个小数
两个小数相乘
两个小数相除
求余运算
5 % 2 = 1 因为
Math.floor(5 / 2) = 2 (商)
2 * 2 = 4
5 - 4 = 1 (余数)
提示:余数运算符(remainder)有时被错误地称为“模数”运算符。它与模数非常相似,但在负数下不能正常工作。
复合赋值之 +=
var myVar = 1;
myVar += 5;
console.log(myVar); // 返回 6
复合赋值之 -=
*复合赋值之 =
复合赋值之 /=
声明字符串变量
转义字符串中的引号
定义一个字符串必须要用单引号或双引号来包裹它。那么当你的字符串里面包含:"或者’时该怎么办呢?
在 JavaScript 中,你可以通过在引号前面使用反斜杠(\)来转义引号。
var sampleStr = "Alan said, \"Peter is learning JavaScript\".";
有了转义符号,JavaScript 就知道这个单引号或双引号并不是字符串的结尾,而是字符串内的字符。所以,上面的字符串打印到控制台的结果为:
Alan said, "Peter is learning JavaScript".
用单引号引用字符串
与其他一些编程语言不同的是,单引号和双引号的功能在 JavaScript 中是相同的。
当你需要在一个字符串中使用多个引号的时候,你可以使用单引号包裹双引号或者相反。常见的场景比如在字符串中包含对话的句子需要用引号包裹。
conversation = 'Finn exclaims to Jake, "Algebraic!"';
另外比如在一个包含有<a>
标签的字符串中,<a>
标签的属性值需要用引号包裹。
var myStr = '<a href="http://www.example.com" target="_blank">Link</a>';
这样字符串中的标签里面任何地方都可以使用双引号。你需要将最外层引号更改为单引号,以便删除转义字符。
但是,如果你想在字符串中使用与最外层相同的引号,会有一些问题。要知道,字符串在开头和结尾都有相同的引号,如果在中间使用了相同的引号,字符串会提前中止并抛出错误。
goodStr = 'Jake asks Finn, "Hey, let\'s go on an adventure?"';
badStr = 'Finn responds, "Let's go!"'; // 抛出错误
在上面的goodStr中,通过使用反斜杠\转义字符可以安全地使用两种引号
提示
不要把反斜杠\和斜杠/搞混,它们不是一回事。
字符串中的转义序列
代码 输出
\' 单引号
\" 双引号
\\ 反斜杠
\n 换行符
\r 回车符
\t 制表符
\b 退格
\f 换页符
请注意,必须对反斜杠本身进行转义才能显示为反斜杠。
用加号运算符连接字符串
用 += 运算符连接字符串
用变量构造字符串
将变量附加到字符串
查找字符串的长度
你可以通过在字符串变量或字符串后面写上.length
来获得字符串变量字符串值的长度。
使用方括号查找字符串中的第一个字符
大多数现代编程语言,如JavaScript,不同于人类从 1 开始计数。它们是从 0 开始计数,这被称为 基于零 的索引。
了解字符串的不变性
在 JavaScript 中,字符串的值是 不可变的,这意味着一旦字符串被创建就不能被改变。
例如,下面的代码:
var myStr = "Bob";
myStr[0] = "J";
是不会把变量myStr的值改变成 “Job” 的,因为变量myStr是不可变的。注意,这并不意味着myStr永远不能被改变,只是字符串字面量 string literal 的各个字符不能被改变。改变myStr中的唯一方法是重新给它赋一个值,例如:
var myStr = "Bob";
myStr = "Job";
使用方括号查找字符串中的第N个字符
你也可以使用方括号来获得一个字符串中的其他位置的字符。
请记住,程序是从0开始计数,所以获取第一个字符实际上是[0]。
使用方括号查找字符串中的最后一个字符
firstName[firstName.length - 1]
使用方括号查找字符串中的第N个字符到最后一个字符
你可以这样firstName[firstName.length - 3]
操作来获得var firstName = "Charles"
字符串中的倒数第三个字符。
填词造句
使用 JavaScript 数组将多个值存储在一个变量中
使用数组,我们可以在一个地方存储多个数据。
以左方括号[开始定义一个数组,以右方括号]结束,里面每个元素之间用逗号隔开,例如:
var sandwich = ["peanut butter", "jelly", "bread"].
将一个数组嵌套在另一个数组中
可以是不同类型的数组被更加高级的数组嵌套。
通过索引访问数组中的数据
数组名称和方括号之间不应有任何空格,如array [0]尽管 JavaScript 能够正确处理,但可能会让看你代码的其他程序员感到困惑
通过索引修改数组中的数据
与字符串的数据不可变不同,数组的数据是可变的,并且可以自由地改变。
使用索引访问多维数组
使用 push() 操作数组
一个简单的方法将数据添加到一个数组的末尾是通过push()函数。
使用 pop() 操作数组
.pop()函数用来“抛出”一个数组末尾的值。我们可以把这个“抛出”的值赋给一个变量存储起来。换句话说就是.pop()函数移除数组末尾的元素并返回这个元素。
数组中任何类型的元素(数值,字符串,甚至是数组)可以被“抛出来” 。
使用 shift() 操作数组
如果想要移出第一个元素要怎么办呢?这就是.shift()的用武之地。它的工作原理就像.pop(),但它移除的是第一个元素,而不是最后一个。
使用 unshift() 操作数组
你不仅可以shift(移出)数组中的第一个元素,你也可以unshift(移入)一个元素到数组的头部。
.unshift()函数用起来就像.push()函数一样, 但不是在数组的末尾添加元素,而是在数组的头部添加元素。
购物清单
用函数编写可重用代码
将值传递给带有参数的函数
函数的参数parameters在函数中充当占位符(也叫形参)的作用,参数可以为一个或多个。调用一个函数时所传入的参数为实参,实参决定着形参真正的值。简单理解:形参即形式、实参即内容。
全局作用域和函数
在函数外定义的变量具有 全局 作用域。这意味着,具有全局作用域的变量可以在代码的任何地方被调用。
这些没有使用var关键字定义的变量,会被自动创建在全局作用域中,形成全局变量。当在代码其他地方无意间定义了一个变量,刚好变量名与全局变量相同,这时会产生意想不到的后果。因此你应该总是使用var关键字来声明你的变量。
//@@
函数内 函数外
有var 局部 全局
无var 全局 无效
局部作用域和函数
函数中的全局作用域和局部作用域
一个程序中有可能具有相同名称的局部变量 和全局变量。在这种情况下,局部变量将会优先于全局变量。
函数可以返回某个值
函数也可以返回 undefined
函数一般用return语句来返回值,但这不是必须的。在函数没有return语句的情况下,当你调用它时,该函数会执行内部代码,返回的值是undefined。
用返回值来赋值
排队
理解布尔值
用 if 语句来表达条件逻辑
相等运算符
3=='3’在js当中为true
严格相等运算符
严格相等运算符(===
)是相对相等操作符( ==
)的另一种比较操作符。与相等操作符不同的是,它会同时比较元素的值和数据类型。
比较不同值
在上两个挑战中,我们学习了相等运算符 (==
) 和严格相等运算符 (===)。现在让我们快速回顾并实践一下。
如果要比较的值不是同一类型,相等运算符会先执行数据类型转换,然后比较值。而严格相等运算符只比较值,不会进行数据类型转换。
由此可见,相等运算符和严格相等运算符的区别是:前者会执行隐式类型转换,后者不会。
3 == '3' // 返回 true,因为 JavaScript 会执行类型转换把字符串 '3' 转化成数字
3 === '3' // 返回 false,因为类型不同,而这里不会进行类型转换
提示 在JavaScript中,你可以使用typeof
运算符确定变量的类型或值,如下所示:
typeof 3 number
typeof “3” string
不等运算符
与相等运算符类似,不相等运算符在比较的时候也会转换值的数据类型。
1 != 2 // true
1 != “1” // false
1 != ‘1’ // false
1 != true // false
0 != false // false
严格不等运算符
严格不相等运算符(!==)与全等运算符是相反的。这意味着严格不相等并返回false的地方,用严格相等运算符会返回true,反之亦然。严格相等运算符不会转换值的数据类型。
大于运算符
大于或等于运算符
与相等运算符相似,大于等于运算符在比较的时候会转换值的数据类型。
6 >= 6 // true
7 >= '3' // true
2 >= 3 // false
'7' >= 9 // false
小于运算符
小于等于运算符
逻辑与运算符
逻辑或运算符
介绍 else 语句
介绍 else if 语句
if else 语句中的逻辑顺序
多个 if else 语句
Not Passed高尔夫代码
使用 Switch 语句从许多选项中进行选择
测试case值使用严格相等运算符进行比较,break 关键字告诉 JavaScript 停止执行语句。如果没有 break 关键字,下一个语句会继续执行。
在 Switch 语句中添加默认选项
在 Switch 语句添加多个相同选项
从函数返回布尔值
函数执行到 return 语句就结束
21点游戏
新建 JavaScript 对象
你之前可能听说过对象object。
对象和数组很相似,数组是通过索引来访问和修改数据,而对象是通过属性来访问和修改数据。
对象适合用来存储结构化数据,就和真实世界的对象一模一样,比如一只猫。
这是一个对象的示例:
var cat = {
"name": "Whiskers",
"legs": 4,
"tails": 1,
"enemies": ["Water", "Dogs"]
};
在这个示例中所有的属性以字符串的形式储存,例如 - “name”, “legs”,和"tails"。但是,你也可以使用数字作为属性,你甚至可以省略字符串属性的引号,如下所示:
var anotherObject = {
make: "Ford",
5: "five",
"model": "focus"
};
//@@注意:这里使用的是冒号,不是等号。属性之间使用的是逗号,不是分号。
但是,如果你的对象具有任何非字符串属性
,JavaScript 将自动将它们转换为字符串类型。
通过点符号访问对象属性
var prop1val = myObj.prop1; // val1
通过方括号访问对象属性
myObj[“Space Name”]; // Kirk
使用方括号需要在属性的名称外面增加双引号,但是使用点符号就不需要。
通过变量访问对象属性
中括号操作符的另一个使用方式是用变量来访问一个属性。当你需要遍历对象的属性列表或查表时,这种方式极为有用。
这有一个使用变量来访问属性的例子:
var dogs = {
Fido: "Mutt", Hunter: "Doberman", Snoopie: "Beagle"
};
var myDog = "Hunter";
var myBreed = dogs[myDog];
console.log(myBreed); // "Doberman"
//@@这里使用了变量的内容作为属性的名称
还有更多:
var someObj = {
propName: "John"
};
function propPrefix(str) {
var s = "prop";
return s + str;
}
var someProp = propPrefix("Name"); // someProp 现在的值为 'propName'
console.log(someObj[someProp]); // 输出 "John"
提示:当我们通过变量名访问属性的时候,不需要给变量名包裹引号。因为实际上我们使用的是变量的值,而不是变量的名称。
更新对象属性
让我们更改它的名称为 “Happy Camper”,这有两种方式来更新对象的name属性:
ourDog.name = "Happy Camper";或
ourDog["name"] = "Happy Camper";
给对象添加新属性
删除对象的属性
delete ourDog.bark;
使用对象进行查找
测试对象的属性
我们可以用.hasOwnProperty(propname)
方法来检查对象是否有该属性
。如果有返回true,反之返回false。
不是属性的内容。
property就是属性的意思。
var myObj = {
top: "hat",
bottom: "pants"
};
myObj.hasOwnProperty("top"); // true
myObj.hasOwnProperty("middle"); // false
操作复杂对象
JavaScript Object Notation 简称JSON是用于存储数据的相关数据交换格式。
{
"artist": "Daft Punk",
"title": "Homework",
"release_year": 1997,
"formats": [
"CD",
"Cassette",
"LP"
],
"gold": true
}
提示
数组中有多个 JSON 对象的时候,对象与对象之间要用逗号隔开。
没错 JSON对象可以是数组的元素。
之前学的javascript的对象其实就是一个JSON对象。
JSON内部的元素和JSON自己 之间都需要使用逗号间隔。
访问嵌套对象
ourStorage.cabinet["top drawer"].folder2;
访问嵌套数组
记录集合
Push 是一个数组方法
The push() method adds zero or more elements to the end of an array and returns the new length of the array.
测试stringify的代码
var collection = {
"2548": {
"album": "Slippery When Wet",
"artist": "Bon Jovi",
"tracks": [
"Let It Rock",
"You Give Love a Bad Name"
]
}
};
// 复制 collection 以便测试
var collectionCopy = JSON.parse(JSON.stringify(collection));
console.log(JSON.stringify(collection));
JSON.parse() 与 JSON.stringify() 简单使用
js之中,null
的含义:
a==null
是指a真的什么都不是,连类型都没有确定
a==“”
是指a是一个空字符串。
while 循环
for 循环
使用 For 循环遍历数组的奇数
使用 For 循环反向遍历数组
使用 For 循环遍历数组
arr.length对于数字数组仍然有效
循环嵌套
do…while 循环
资料查找
使用 JavaScript 生成随机分数
Math.random()
用来生成一个在0(包括 0)到1不包括 1)之间的随机小数,因此Math.random()
可能返回 0 但绝不会返回 1。
使用 JavaScript 生成随机整数
- 用Math.random()生成一个随机小数。
2.把这个随机小数乘以20。
3.用Math.floor()向下取整 获得它最近的整数。
记住Math.random()永远不会返回1。同时因为我们是在用Math.floor()向下取整,所以最终我们获得的结果不可能有20。这确保了我们获得了一个在0到19之间的整数。
把操作连缀起来,代码类似于下面:
Math.floor(Math.random() * 20);
生成某个范围内的随机整数
Math.floor(Math.random() * (max - min + 1)) + min
注意Math.ramdom()后面乘的是(max-min+1)
使用 parseInt 函数
使用 parseInt 函数并传入一个基数
parseInt()函数解析一个字符串并返回一个十进制整数。它同时可接受第二个参数,一个介于2和36之间的整数,表示这个字符串的基数(进制)。
函数调用如下所示:
parseInt(string, radix);
示例:
var a = parseInt("11", 2);
参数 2 表示 “11” 使用二进制数值系统。此示例将字符串 “11” 转换为整数 3。
使用三元运算符
condition ? statement-if-true : statement-if-false;
使用多个三元运算符