JavaScript 菜鸟教程阅读笔记+总结+源码
文章简介
本文是我在 Runoob.com 菜鸟教程上的总结与学习笔记。
除了引用 菜鸟教程上的内容之外，我添加了许多它没有介绍，但是也很重要的内容。
另外，我对 JavaScript 的内容进行了重新排版，排版后的内容更适合阅读。
如果你想直接访问菜鸟教程，请点击上方的超链接。
强烈建议，当遇到不能理解的知识点，去菜鸟教程上运行实例观察。
或者你也可以在你的电脑上运行。
JavaScript
简介
官方说明
JavaScript 是互联网上最流行的客户端脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
# 脚本语言：不需要编译，直接可被浏览器解析执行。
JavaScript 是可插入 HTML 页面的编程代码，由浏览器执行。每一个浏览器都有 JavaScript 的解析引擎。
我的解释
JavaScript 使得用户在客户端进行操作时，可以不需要与服务器端产生交互。由此来避免一些对用户极其不友好的体验。
比如，填写了半个小时表单，提交给服务器后，服务器响应结果为“密码格式错误，请重新填写！”，用户又需要重新填写表单。而像格式校验这样的工作，我们其实就可以交给 JavaScript 来解决，这样是最为合理的方式。
发展史
1992年，Nombase公司，开发出第一门客户端脚本语言，专门用于表单的校验。命名为 ： C-- ，后来更名为 ScriptEase
1995年，Netscape(网景)公司，开发了一门客户端脚本语言：LiveScript。后来，请来SUN公司的专家，修改LiveScript，并该名为 JavaScript
1996年，微软抄袭 JavaScript 开发出 JScript
于是，”客户端脚本语言界的三足鼎立“开始了。当然这对程序员非常不友好，因为此时程序员需要编写三份不用的代码以适配所有浏览器。
1997年，ECMA(欧洲计算机制造商协会)，制定出客户端脚本语言的标准：ECMAScript
最终，ECMAScript 成为了所有脚本语言的标准化规范，终止了客户端脚本语言界混乱不堪的现象。
我们可以将 ECMAScript 理解为“标准”，将ScriptEase、JavaScript、JScript理解为“标准的实现和扩展”。
所以，其实如今的 JavaScript 其实是由：公共的ECMAScript 和 独有的JavaScript(DOM,BOM) 这两个部分组成。
ECMAScript
注释
单行注释：//注释内容
多行注释：/*注释内容*/
// 注释
/* 注释 */
验证js支持
如果用户不能确定浏览器是否支持JavaScript脚本，那么可以应用HTML提供的注释符号进行验证。
对于不支持 JavaScript 的浏览器，将会把编写的 JavaScript 脚本作为注释处理。
<script>
<!--
document.write("您的浏览器支持JavaScript脚本!");
//-->
</script>
<script>标签
- <script>可以定义在html页面的任何位置。
- <script>可以定义多个。
- <script>定义的位置会影响执行顺序。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body><script>document.write("<h1>这是一个标题</h1>");document.write("<p>这是一个段落。</p>");</script></body>
</html>
内部样式
在 html文件中的 <script>标签中，直接编写 JavaScript代码。
<script>document.write("我在html文件中，我是内部js语句！");
</script><script>alert("我在html文件中，我是内部js语句！");
</script>
外部样式
在 html文件中的 <script>标签中，使用 “src”属性 来引入 外部js文件。
document.write("我在js文件中，我是外部js语句！");
alert("我在js文件中，我是外部js语句！");
<script src="style01.js">
</script><script src="style02.js">
</script>
如果<script>标签中，既有 JavaScript代码，又引用了 外部js文件，那么依然会执行 外部js代码。
<script src="style01.js">/* 内部js语句不会执行 */document.write("我在html文件中，我是内部js语句！");
</script><script src="style02.js">/* 内部js语句不会执行 */alert("我在html文件中，我是内部js语句！");
</script>
函数
我们把一个 JavaScript 函数放置到 HTML 页面的 <head> 部分，该函数会在点击按钮时被调用。
<!DOCTYPE html>
<html>
<head>
<script>function myFunction(){document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";}
</script>
</head>
<body><p id="demo">一个段落</p><button type="button" onclick="myFunction()">点我</button>
</body>
</html>
输出
JavaScript 可以通过不同的方式来输出数据：
- 使用 window.alert() 弹出警告框。
- 使用 innerHTML 写入到 HTML 元素。
- 使用 document.write() 方法将内容写到 HTML 文档中。
- 使用 console.log() 写入到浏览器的控制台。
window.alert()
在浏览器中弹出警告框：
<script>window.alert(5 + 6);
</script>
innerHTML
获取元素后，修改元素的内容：
document.getElementById(“demo”) 是使用 id 属性来查找 HTML 元素的 JavaScript 代码 。
innerHTML = “段落已修改。” 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。
<p id="demo">我的第一个段落</p><script>document.getElementById("demo").innerHTML = "段落已修改。";
</script>
document.write()
直接写在HTML 文档中：
<p>我的第一个段落。</p><script>
document.write(Date());
</script>
如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖：
<p>我的第一个段落。</p><button onclick="myFunction()">点我</button><script>
function myFunction() {document.write(Date());
}
</script>
onsole.log()
如果您的浏览器支持调试，你可以使用 console.log() 方法在浏览器中显示 JavaScript 值。
浏览器中使用 F12 来启用调试模式， 在调试窗口中点击 “Console” 菜单。
<script>console.log("喜欢");
</script>
变量
Java 是强类型语言。
在开辟变量存储空间时，定义了空间将来存储的数据的数据类型。
变量只能存储固定类型的数据。
语法：数据类型 变量名 = 初始化值;
int i = 1;
float f = 1.11f;
String s = "ABC"
JavaScript 是弱类型语言。
在开辟变量存储空间时，不定义空间将来的存储的数据的数据类型。
变量可以存放任意类型的数据。
语法：var 变量名 = 初始化值;
var i = 1;
var f = 1.11f;
var c = "ABC"
命名规则
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
- 变量名称对大小写敏感（y 和 Y 是不同的变量）
声明
您可以在一条语句中声明很多变量。该语句以 var 开头，并使用逗号分隔变量即可：
var lastname="Doe", age=30, job="carpenter";
声明也可横跨多行：
var lastname="Doe",
age=30,
job="carpenter";
一条语句中声明的多个不可以赋同一个值:
var x,y,z=1; // x,y=undefined z=1
如果重新声明 JavaScript 变量，该变量的值不会丢失。
在以下两条语句执行后，变量 carname 的值依然是 “Volvo”：
var carname="Volvo";
var carname;
局部变量
"let"关键字 允许你声明一个作用域被限制在块级中的变量、语句或者表达式。在Function中局部变量推荐使用let变量，避免变量名冲突。
function varTest() {var x = 1;if (true) {var x = 2; // 同样的变量!console.log(x); // 2}console.log(x); // 2
}function letTest() {let x = 1;if (true) {let x = 2; // 不同的变量! console.log(x); // 2 }console.log(x); // 1
}
常量
"const"关键字 用来声明 JavaScript中的常量。
//定义常量a并赋值为0
const a = 0;//报错（不能重新赋值）
a = 1;//报错（不能重新声明）
const a = 2;//输出0
console.log("a is: " + a);
全局变量
如果您把值赋给尚未声明的变量，该变量将被自动作为 window 的一个属性。
这条语句，将声明 window 的一个属性 carname：
carname = "Volvo";
非严格模式下给未声明变量赋值创建的全局变量，是全局对象的可配置属性，可以删除：
var var1 = 1; // 不可配置全局属性
var2 = 2; // 没有使用 var 声明，可配置全局属性console.log(this.var1); // 1
console.log(window.var1); // 1
console.log(this.var2); // 2
console.log(window.var2); // 2delete var1; // false 无法删除
console.log(var1); // 1delete var2; // true 可以删除
console.log(var2); // 报错变量未定义
数据类型
JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型：
var x; // x 为 undefined
var x = 5; // 现在 x 为数字
var x = "John"; // 现在 x 为字符串
字符串
字符串可以是引号中的任意文本。
您可以使用单引号或双引号：
var an = "cat";
var an = 'cat';
你可以在字符串中使用引号，只要不匹配包围字符串的引号即可：
var answer = "It's alright";
var answer = "He is called 'Johnny'";
var answer = 'He is called "Johnny"';
你也可以在字符串添加转义字符来使用引号：
var x = 'It\'s alright';
var y = "He is called \"Johnny\"";
字符串可以是对象：
var x = "John";
var y = new String("John");
typeof x // 返回 String
typeof y // 返回 Object
数字
JavaScript 只有一种数字类型。
数字可以带小数点，也可以不带：
var x1 = 34.00; //使用小数点来写
var x2 = 34; //不使用小数点来写
极大或极小的数字可以通过科学（指数）计数法来书写：
var y=123e5; // 12300000
var z=123e-5; // 0.00123
布尔值
布尔（逻辑）只能有两个值：true 或 false。
var x = true;
var y = false;
数组
下面的代码创建名为 cars 的数组：
var cars = new Array();
cars[0] = "Saab";
cars[1] = "Volvo";
cars[2] = "BMW";
或者 (condensed array)：
var cars = new Array("Saab","Volvo","BMW");
或者 (literal array)：
var cars=["Saab","Volvo","BMW"];
对象
对象由 花括号{} 分隔，属性由 逗号, 分隔。
在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。
下面的例子中，对象 (person) 有三个属性：firstname、lastname 以及 id：
var person = {firstname:"John", lastname:"Doe", id:5566};
空格和折行无关紧要。声明可横跨多行：
var person = {firstname : "John",lastname : "Doe",id : 5566
};
对象属性有两种寻址方式：
name = person.lastname;
name = person["lastname"];
在对象中定义一个方法：
var person = {firstname : "John",lastname : "Doe",id : 5566 ,talk : funciton(){document.write("HelloWorld！")}
};
Undefined / Null / NaN
- undefined
- 一个没有设置值的变量。
- 当一个变量没有给定初始化值时，自动赋值。
- 可以通过将变量的值设置为 undefined 来清空变量。值为 undefined, 类型为 undefined。
- Null
- 主动释放。
- 可以通过将变量的值设置为 null 来清空变量。值为 null(空), 但类型为对象。
- NaN
- 一个不是数字的数字类型。 (Not A Number)
- NaN参加运算，任何运算结果都为NaN。
注意：null 和 undefined 的值相等，但类型不等：
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true
判断变量的数据类型
typeof 方法
你可以使用 typeof 操作符来检测变量的数据类型，括号可加可不加。
typeof(1) // number
typeof(1.11) // number
typeof(NaN) // numbertypeof "ABC" // string
typeof 'ABC' // stringtypeof true // boolean
typeof false // booleantypeof undefined // undefinedtypeof null // object
typeof [1,2,3,4]; // object
typeof {name:'John', age:34} // object
typeof new Date() // objecttypeof function () {} // function
isArray 方法
注意：isArray 只能用来判断 Array！
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";// 判断是否支持该方法
if (Array.isArray) { // 检验该对象是否为数组if(Array.isArray(cars)) {document.write("true") ;}
}
instanceof 操作符
注意：instanceof 只能用来判断 Object ！
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";if (cars instanceof Array) {document.write("该对象是一个数组。") ;
}
作用域
局部作用域
在局部作用域：只能在函数内部访问。
变量在函数内声明，即为局部变量。
局部变量在函数开始执行时创建，函数执行完后局部变量会自动销毁。
// 此处不能调用 carName 变量
function myFunction() {var carName = "Volvo";// 函数内可调用 carName 变量
}
全局作用域
全局作用域：网页中所有脚本和函数均可使用。
变量在函数外定义，即为全局变量。
全局变量在页面关闭后销毁。
var carName = " Volvo";// 此处可调用 carName 变量
function myFunction() {// 函数内可调用 carName 变量
}
如果变量没有声明（没有使用 var 关键字），该变量也为全局变量，不论这个变量在哪被使用。
// 函数myFunction被调用后，此处可调用 carName 变量function myFunction() {carName = "Volvo";// 此处可调用 carName 变量
}
运算符
类型转换
如果变量不是运算符所要求的类型，变量将自动进行类型转换。
其他类型转number：
// string -> number
var num1 = +"123"; // 123
var num2 = +"abc"; // NaN// boolean -> number
var num3 = +true; // 1
var num4 = +false; // 0// null -> number
var num5 = +null; // 0// undefined -> number
var num6 = +undefined; // NaN
其他类型转boolean：
// number：0或NaN为假，其他为真
document.write( !!3 + "<br>"); //true
document.write( !!0 + "<br>");
document.write( !!NaN + "<br><br>");// string：除了空字符串("")，其他为真
document.write( !!"a" + "<br>"); //true
document.write( !!"" + "<br><br>");// null：假
document.write( !!null + "<br><br>");// undefined：假
document.write( !!undefined + "<br><br>");// object：真
document.write( !!new Date() + "<br><br>"); //true
所以 Java的条件语句为：if(obj != null)，而 JavaScript的条件语句为：if(obj)。
比较方式
类型相同，直接比较
字符串按照字典顺序，逐位比较ASCII码大小。
document.write("a" > "z"); // false
document.write("azzzz" > "zaaaa"); // false
类型不同，先转换类型，再比较
document.write("123" == 123); // true
=== 绝对等于：值和类型均相等。
document.write("123" === 123); // false
条件运算符
条件运算符可以基于某些条件对变量进行赋值。
三元运算符
- age<18 成立，返回"年龄太小"
- age<18 不成立，返回"年龄已达到"
voteable = ( age < 18 ) ? "年龄太小" : "年龄已达到";
多元运算符
- p>1 成立：
- p<12 成立，返回 p>12（false）。
- p<12 不成立，返回 p=6。
- p>1 不成立：
- 返回 p=3。
function test(p,b){return p>1 ? p<12 ? p>12 : p=6 : p=3; // p>1 ? 整体 : p=3 和 p<12 ? p>12 : p=6
}
流程控制语句
if…else…
只有当指定条件为 true 时，该语句才会执行代码。
if (condition) {当条件为 true 时执行的代码
}
在条件为 true 时执行代码，在条件为 false 时执行其他代码。
if (condition) { 当条件为 true 时执行的代码}
else {当条件不为 true 时执行的代码
}
选择多个代码块之一来执行。
if (condition1) {当条件 1 为 true 时执行的代码
} else if (condition2) {当条件 2 为 true 时执行的代码
} else {当条件 1 和 条件 2 都不为 true 时执行的代码
}
switch
在 Java 中，switch语句可以接受的数据类型：byte int short char 枚举(1.5) String(1.7)。
在 JavaScript 中，switch语句可以接受任意的原始数据类型。
switch(n) {case 1:执行代码块 1break;case 2:执行代码块 2break;default:匹配不存在时做的事情
}
for
语句 1 （代码块）开始前执行
语句 2 定义运行循环（代码块）的条件
语句 3 在循环（代码块）已被执行之后执行
for (语句1 ; 语句2 ; 语句3) {循环体
}
语句 1
通常我们会使用语句 1 初始化循环中所用的变量 (var i=0)。
语句 1 是可选的，不使用语句 1 也可以。
您可以在语句 1 中初始化任意（或者多个）值：
var i=2,len=cars.length;
for (; i<len; i++){ document.write(cars[i] + "<br>");
}
语句 2
通常语句 2 用于评估初始变量的条件。
语句 2 同样是可选的。
如果语句 2 返回 true，则循环再次开始，如果返回 false，则循环将结束。
如果您省略了语句 2，那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。
语句 3
通常语句 3 会增加初始变量的值。
语句 3 也是可选的（比如当循环内部有相应的代码时）：
var i=0,len=cars.length;
for (; i<len; ){ document.write(cars[i] + "<br>");i++;
}
for In
遍历数组，则变量为索引：
var nums = [1, 3, 5];for (var x in nums) {document.write(nums[x]+ "<br />");
}
for of
遍历数组，则变量为元素：
var nums = [1, 3, 5];for (var x of nums) {document.write( x + "<br />");
}
while
while 循环会在指定条件为真时循环执行代码块。
while (条件)
{需要执行的代码
}
do/while
do/while 循环会在检查条件是否为真之前执行一次代码块，然后如果条件为真的话，就会重复这个循环。
do
{需要执行的代码
}
while (条件);
break & continue
break 语句可用于跳出循环。
for (i=0;i<10;i++)
{if (i==3){break; }x = x + "The number is " + i + "<br>";
}
// 该数字为 0
// 该数字为 1
// 该数字为 2
continue 语句跳出循环后，会继续执行该循环之后的代码（如果有的话）。
for (i=0;i<6;i++)
{if (i==3){countinue; }x = x + "The number is " + i + "<br>";
}
// 该数字为 0
// 该数字为 1
// 该数字为 2
// 该数字为 4
// 该数字为 5
标记
如需标记 JavaScript 语句，请在语句之前加上冒号：
label:
statements
break 和 continue 语句仅仅是能够跳出代码块的语句。
通过标签引用，break 语句可用于跳出任何 JavaScript 代码块：
var nums = [1, 2, 3];// 标签
label:
for (var x of nums) {for (var y of nums) {document.write( (x*y) + " ");if (y == 2 && x == 2 ) {// 跳出两个循环break label; }}document.write("<br />");
}
- 练习：99乘法表
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>99乘法表</title><style>td{border: 1px solid;}</style><script>document.write("<table align='center'>");//1.完成基本的for循环嵌套，展示乘法表for (var i = 1; i <= 9 ; i++) {document.write("<tr>");for (var j = 1; j <=i ; j++) {document.write("<td>");//输出 1 * 1 = 1document.write(i + " * " + j + " = " + ( i*document.write("</td>");}/*//输出换行document.write("<br>");*/document.write("</tr>");}//2.完成表格嵌套document.write("</table>");</script>
</head>
<body>
</body>
</html>
类型转换
字符串
全局方法 String() 可以将变量转换为字符串。
该方法可用于任何类型的数字，字母，变量，表达式：
String(123)
String(false)
String(new Date())
toString() 也是有同样的效果：
(123).toString()
false.toString()
new Date().toString()
数字
Number("3.14") // 返回 3.14
Number(" ") // 返回 0
Number("") // 返回 0
Number("99 88") // 返回 NaNNumber(false) // 返回 0
Number(true) // 返回 1Number(new Date()) // 返回 1404568027739"111".valueOf() // 111parseInt("111") // 111
正则表达式
正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。
/正则表达式主体/修饰符(可选)
例如：var patt = /runoob/i
/runoob/i 是一个正则表达式。
runoob 是一个正则表达式主体 (用于检索)。
i 是一个修饰符 (搜索不区分大小写)。
String对象的方法
在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()。
search() 方法 用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
var str = "Visit Runoob!";
var n = str.search(/Runoob/i);
search 方法可使用字符串作为参数，字符串参数会转换为正则表达式：
var str = "Visit Runoob!";
var n = str.search("Runoob");
replace() 方法 用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
var str = "Visit microsoft!";
var txt = str.replace(/microsoft/i,"Runoob");
replace() 方法将接收字符串作为参数，字符串参数会转换为正则表达式：
var txt = str.replace("microsoft","Runoob");
修饰符
| 修饰符 | 描述 |
|---|---|
| i | 执行对大小写不敏感的匹配 |
| g | 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止） |
| m | 执行多行匹配 |
表达式
方括号用于查找某个范围内的字符：
| 表达式 | 描述 |
|---|---|
| [abc] | 查找方括号之间的任何字符。 |
| [^abc] | 查找任何不在方括号之间的字符。 |
| [0-9] | 查找任何从 0 至 9 的数字。 |
| [a-z] | 查找任何从小写 a 到小写 z 的字符。 |
| [A-Z] | 查找任何从大写 A 到大写 Z 的字符。 |
| [A-z] | 查找任何从大写 A 到小写 z 的字符。 |
| [adgk] | 查找给定集合内的任何字符。 |
| [^adgk] | 查找给定集合外的任何字符。 |
| (red|blue|green) | 查找任何指定的选项。 |
元字符
元字符是拥有特殊含义的字符：
| 元字符 | 描述 |
|---|---|
| . | 查找单个字符，除了换行和行结束符。 |
| \w | 查找单词字符。 |
| \W | 查找非单词字符。 |
| \d | 查找数字。 |
| \D | 查找非数字字符。 |
| \s | 查找空白字符。 |
| \S | 查找非空白字符。 |
| \b | 匹配单词边界。 |
| \B | 匹配非单词边界。 |
| \0 | 查找 NULL 字符。 |
| \n | 查找换行符。 |
| \f | 查找换页符。 |
| \r | 查找回车符。 |
| \t | 查找制表符。 |
| \v | 查找垂直制表符。 |
| \xxx | 查找以八进制数 xxx 规定的字符。 |
| \xdd | 查找以十六进制数 dd 规定的字符。 |
| \uxxxx | 查找以十六进制数 xxxx 规定的 Unicode 字符。 |
量词
| 量词 | 描述 |
|---|---|
| n+ | 1 或 n。例如，/a+/ 匹配 “candy” 中的 “a”，“caaaaaaandy” 中所有的 “a”。 |
| n* | 0 或 n。例如，/bo*/ 匹配 “A ghost booooed” 中的 “boooo”，“A bird warbled” 中的 “b”，但是不匹配 “A goat grunted”。 |
| n? | 0 或 1。例如，/e?le?/ 匹配 “angel” 中的 “el”，“angle” 中的 “le”。 |
| n{X} | x。例如，/a{2}/ 不匹配 “candy,” 中的 “a”，但是匹配 “caandy,” 中的两个 “a”，且匹配 “caaandy.” 中的前两个 “a”。 |
| n{X,} | 至少 x 个。例如，/a{2,}/ 不匹配 “candy” 中的 “a”，但是匹配 “caandy” 和 “caaaaaaandy.” 中所有的 “a”。 |
| n{X,Y} | x 至 y。例如，/a{1,3}/ 不匹配 “cndy”，匹配 “candy,” 中的 “a”，“caandy,” 中的两个 “a”，匹配 “caaaaaaandy” 中的前面三个 “a”。注意，当匹配 “caaaaaaandy” 时，即使原始字符串拥有更多的 “a”，匹配项也是 “aaa”。 |
| n$ | 结尾为字符串 n 。 |
| ^n | 开头为字符串 n 。 |
| ?=n | 其后紧接字符串 n 。 |
| ?!n | 其后没有紧接字符串 n 。 |
对象
Function对象
- 特点
- length：代表形参的个数
- 函数不用写形参类型和返回值类型。
- 函数是一个对象，如果定义名称相同的函数，原本的函数会被覆盖。
- 函数的调用，仅与其名称有关，和参数列表无关。
- 函数仅能调用一次。
- length：代表形参的个数
创建Function对象的方法，有以下三种方式：
var fun1 = new Function("a" , "b" , "document.write( a + '<br>'); document.write( b + '<br>'); document.write(fun1.length + '<br>' + '<br>');");
function fun2(a,b,c) {document.write(a + "<br>");document.write(b+'<br>');document.write(c+'<br>');document.write(fun2.length+'<br>'+'<br>');
}
var fun3 = function(a,b,c,d){document.write(a+'<br>');document.write(b+'<br>');document.write(c+'<br>');document.write(d+'<br>');document.write(fun3.length+'<br>'+'<br>');
}
在函数声明中有一个隐藏的内置对象（数组），arguments封装了所有的实际参数。
function add(){var sum = 0;for (var i = 0; i < arguments.length; i++) {sum += arguments[i];}return sum;
}var sum = add(1,2,3,4,5,6,7,8,9,10);document.write(sum); // 55
Array对象
- 特点
- 元素类型可变。
- 数组长度可变。
创建对象
1.常规方式：
var mycars = new Array();
mycars[0] = "Saab";
mycars[1] = "Volvo";
mycars[2] = "BMW";
2.简洁方式：
var myCars = new Array("Saab","Volvo","BMW");
3.字面：
var myCars = ["Saab","Volvo","BMW"];
对象方法
indexOf() 方法可返回数组中某个指定的元素位置。
var y = myCars.indexOf("Volvo")
join() 方法用于把数组中的所有元素转换一个字符串。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var energy = fruits.join();// 输出为 Banana,Orange,Apple,Mango
push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi")// 输出为 Banana,Orange,Apple,Mango,Kiwi
pop() 方法用于删除数组的最后一个元素并返回删除的元素。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();// 输出为 Banana,Orange,Apple
Date对象
创建对象
Date 对象用于处理日期和时间。
可以通过 new 关键词来定义 Date 对象。
有四种方式初始化日期:
new Date() // 当前日期和时间 Fri Feb 07 2020 18:03:29 GMT+0800 (中国标准时间)new Date(1581069604154) //返回从 1970 年 1 月 1 日至今的毫秒数new Date("October 13, 1975 11:13:00") // 指定日期和时间的字符串new Date(9,5,24,11,33,0) // year month day hours minutes seconds milliseconds
设置日期
通过使用针对日期对象的方法，我们可以很容易地对日期进行操作。
在下面的例子中，我们为日期对象设置了一个特定的日期 (2010 年 1 月 14 日)：
var myDate = new Date();
myDate.setFullYear(2010,0,14);
在下面的例子中，我们将日期对象设置为 5 天后的日期：
var myDate = new Date();
myDate.setDate(myDate.getDate() + 5);
对象方法
getTime() 方法可返回距 1970 年 1 月 1 日之间的毫秒数。
var d = new Date();
var n = d.getTime();// 输出为 1581069604154
toLocaleString() 方法可根据本地时间把 Date 对象转换为字符串，并返回结果。
var d=new Date();
var n=d.toLocaleTimeString();// 输出为 2020/2/7 下午6:04:45
Math对象
创建对象
Math对象不用创建，直接使用。
var x = Math.PI;
var y = Math.sqrt(16);
对象方法
| 方法 | 描述 |
|---|---|
| abs(x) | 返回 x 的绝对值。 |
| ceil(x) | 对 x 进行上舍入。 |
| floor(x) | 对 x 进行下舍入。 |
| max(x,y,z,…,n) | 返回 x,y,z,…,n 中的最高值。 |
| min(x,y,z,…,n) | 返回 x,y,z,…,n中的最低值。 |
| pow(x,y) | 返回 x 的 y 次幂。 |
| random() | 返回 0 ~ 1 之间的随机数。 |
| round(x) | 四舍五入，底层为 floor(x+0.5)。 |
| sqrt(x) | 返回数的平方根。 |
如下所示：
Math.abs(1) // 1
Math.abs(-1) // 1Math.ceil(1.1) // 2
Math.ceil(1.9) // 2Math.floor(1.1) // 1
Math.floor(1.9) // 1Math.max(1,2,3,4,5) // 5
Math.min(1,2,3,4,5) // 1pow(2,10) // 1024Math.round(-1) // floor(-0.5) = -1
Math.round(1) // floor(1.5) = 1Math.round(-1.5) // floor(-1) = -1
Math.round(1.5) // floor(2) = 2Math.sprt(1024) // 32
RegExp对象
RegExp：是正则表达式（regular expression）的简写。
正则表达式描述了字符的模式对象。
当您检索某个文本时，可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。
创建对象
- 模式(parttern) 描述了一个表达式模型。
- 修饰符(modifiers) 描述了检索是否是全局，区分大小写等。
var patt=new RegExp(pattern,modifiers);或更简单的方法var patt=/pattern/modifiers;
例如：
var re = new RegExp("\\w+");
var re = /\w+/;
在字符串中不区分大小写找"is"：
var patt1 = /is/i;
全文查找 “is”：
var patt1=/is/g;
全文查找和不区分大小写搜索 “is”：
var patt1=/is/gi;
对象方法
test()方法搜索字符串指定的值，根据结果并返回真或假。
var str = 'runoob';var patt1 = new RegExp('\\w', 'g'); // 有转义,作为正则表达式处理
var patt2 = new RegExp('\w', 'g'); // 无转义,作为字符串处理document.write( patt1.test(str) ) //输出 true
document.write( patt2.test(str) ) //输出 false
Global对象
创建对象
Global全局对象，其方法不需要对象就可以直接调用。
对象方法
encodeURI() 方法可把字符串作为 URI 进行编码。
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： , / ? : @ & = + $ #
encodeURI("123") // 123encodeURI("abcABC") // abcABCencodeURI("@") // @encodeURI("￥") // %EF%BF%A5encodeURI("笑") // %E7%AC%91encodeURI("http://www.baidu.com?username=李白")
// http://www.baidu.com?username=%E6%9D%8E%E7%99%BD
decodeURI() 方法可对 encodeURI() 方法编码过的 URI 进行解码。
var str = "恭喜发财";var uri = encodeURI(str); // ％E6％81％AD％E5％96％9C％E5％8F％91％E8％B4％A2var str = decodeURI(uri); // 恭喜发财
encodeURIComponent() 方法可把字符串作为 URI 组件进行编码。
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ’ ( ) 。
decodeURIComponent() 方法可对 encodeURIComponent() 方法编码的 URI 进行解码。
encodeURIComponent("123") // 123encodeURIComponent("abcABC") // abcABCencodeURIComponent("@") // %40encodeURIComponent("￥") // %EF%BF%A5encodeURIComponent("笑") // %E7%AC%91encodeURI("http://www.baiducom?username=李白")
// http%3A%2F%2Fwww.baidu.com%3Fusername%3D%E6%9D%8E%E7%99%BD
parseInt() 方法可解析一个字符串，并返回一个整数。
parseInt("11") // 11
parseInt("11.11") // 11
parseInt("11 12 13") // 11
parseInt(" 11 ") // 11parseInt("11 years") // 11
parseInt("He was 11") // NaNparseInt("10",16) // 16
parseInt("10",10) // 10
parseInt("10",8) // 8parseInt("0x10") // 16
parseInt("010") // 10
isNaN() 方法用于检查其参数是否是非数字值。
如果参数值为 NaN 或字符串、对象、undefined等非数字值则返回 true, 否则返回 false。
isNaN(123) // false
isNaN(-1.23) // false
isNaN(5-2) // false
isNaN(0) // falseisNaN("Hello") // true
isNaN("2005/12/12") // true
eval() 方法计算 JavaScript 字符串，并把它作为脚本代码来执行。
如果参数是一个表达式，eval() 函数将执行表达式。如果参数是Javascript语句，eval()将执行 Javascript 语句。
eval("x=10;y=20;document.write(x*y)");
document.write("<br>" + eval("2+2"));
document.write("<br>" + eval(x+17));// 输出为 200 4 27
编码
URL
URL 统一资源定位符（Uniform Resource Locator），其实就是我们访问web页面时需要输入的”网页地址“”网址“，比如：https://www.google.com/ 就是URL。
完整定义如下：
协议类型
介绍: 知识付费阅读小程序源码,前端+后台源码,带有代理,分销,课程资源更新等等功能. 没有安装教程,微擎的就不多说了. 网盘下载地址: http://kekewangLuo.net/R9cbFxmn ... Go 的源码在安装包的 src/ 目录下.怎么看它的源码呢?直接看吧!没人教的情况下,只能自己撸了.当然,这种内容一般也不会有人教. 怎么撸? Go 源码中,应该可分为与语言息息相关的部分,和官方提供 ... 天,给大家分享的是如何在.NET平台中开发"邮件发送"功能.在网上搜的到的各种资料一般都介绍的比较简单,那今天我想比较细的整理介绍下. AD:2013云计算架构师峰会精彩课程曝光 ... 今天,给大家分享的是如何在.NET平台中开发"邮件发送"功能.在网上搜的到的各种资料一般都介绍的比较简单,那今天我想比较细的整理介绍下: 1) 邮件基础理论知识 2 ... 转载自http://www.cnblogs.com/heyuquan/p/net-batch-mail-send-async.html 今天,给大家分享的是如何在.NET平台中开发"邮件发送 ... Python基础教程-菜鸟教程学习笔记1 文章目录 Python基础教程-菜鸟教程学习笔记1 前言 Python 简介 1. 第一个Python程序 2. Python 中文编码 3. 基本语法 1) ... Android精选源码 Android仿照36Kr官方新闻项目课程源码 一个优雅美观的下拉刷新布局,众多样式可选 安卓版本的VegaScroll滚动布局 android物流详情的弹框 健身饮食记录助手 ... java计算机毕业设计vue校园菜鸟驿站管理系统(附源码.数据库) 项目运行 环境配置: Jdk1.8 + Tomcat8.5 + Mysql + HBuilderX(Webstorm也行)+ Ecl ... CSDN GitHub Ubuntu 安裝 GNU Global(gtags) 阅读Linux内核源码 AderXCoding/system/tools/global 本作品采用知识共享署名-非商业性 ...JavaScript 菜鸟教程阅读笔记+总结+源码相关推荐
最新文章
热门文章