在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。
您能够在 HTML 文档中放置任意数量的脚本。
脚本可被放置与 HTML 页面的 body 或 head 部分中，或兼而有之。
脚本可放置于外部文件中 JavaScript文件拓展名是 .js
如需使用外部脚本 请在script标签的src属性中设置脚本的名称
可以在Head 或body标签中放置外部脚本应用
外部脚本不能包含script标签
外部js的优势
外部引用
<script src="/js/myScript1.js"></script>
<script src="https://www.w3school.com.cn/js/myScript1.js"></script>
使用window.alert()写入警告框
使用document.write()写入html
使用innerHTML写入HTML元素
如需访问HTML元素 js可使用document.getElementById(id)方法
id属性定义HTML元素 innerHTML属性定义HTML内容
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
使用console.log()写入浏览器控制台
JS语句由 值、运算符、表达式、关键词、注释构成
这条语句告诉浏览器在 id="demo" 的 HTML 元素中输出 "Hello Kitty."：
document.getElementById("demo").innerHTML = "Hello Kitty.";
分号分隔JS语句 在每条可执行的语句后面添加分号 c语言？
如果由分号分隔，允许在同一行写多条语句
以分号结束语句不是必须的，但强烈建议这么做
JS会忽略多个空白格 可以向脚本添加空格以增强可读性
在运算符旁边添加空格是个好习惯
为了达到最佳的可读性，程序员们常常喜欢把代码行控制在 80 个字符以内。
如果 JavaScript 语句太长，对其进行折行的最佳位置是某个运算符或逗号之后
JS语句可以用花括号组合在代码块中 代码块的作用是定义一同执行的语句
JS关键字指的是保留的单词 保留词无法用作变量名 具体参照w3school
JS语法定义两种类型的值：混合值和变量值
混合值被称为字面量 变量值被称为变量
书写混合值：写数值有无小数点均可 字符串是文本，由单引号或双引号包围
使用 var 关键词来声明变量 = 为变量赋值 使用算数运算符加减乘除来计算值
表达式是值、变量、运算符的组合
注释风格： 双斜杠或者 /* */ 单行注释用双斜杠 多行注释用后面一种
标识符：首字符必须是字母、下划线或者美元符号 连串的字符可以是字母、数字、下划线或者美元符号 数值不可以作为首字符
标识符对大小写敏感 倾向于使用驼峰命名法
构造变量名称（唯一标识符）的通用规则是：
名称可包含字母、数字、下划线和美元符号
名称必须以字母开头
名称也可以 $ 和 _ 开头（但是在本教程中我们不会这么做）
名称对大小写敏感（y 和 Y 是不同的变量）
保留字（比如 JavaScript 的关键词）无法用作变量名称
在脚本开头声明所有变量是个好习惯
一条语句声明多个变量，用逗号分隔变量 声明也可横跨多行
未被赋值的变量的值是 undefined
如果再次声明某个 JavaScript 变量，将不会丢它的值。
var carName = "porsche";
var carName;
可以用加号级联数字或者字符
相加两个数字，将返回和，但对一个数字和一个字符串相加将返回一个字符串
=等值等型 ！不等值或者不等型
类型运算符 typeof instanceof
取幂运算符** ：将第一个操作数提升到第二个操作数的幂 x**y就是x的y次方 与Math.pow(x,y)相同
运算优先级：见表格
JS变量能够保存多种数据类型：数值、字符串值、数组、对象等等
var length = 7; // 数字
var lastName = "Gates"; // 字符串
var cars = ["Porsche", "Volvo", "BMW"]; // 数组
var x = {firstName:"Bill", lastName:"Gates"}; // 对象
JavaScript 从左向右计算表达式。不同的次序会产生不同的结果：
911 + 7 + “a” 和 “a” + 911 +7 是不同的
第一个得到918a 第二个得到a9117
变量类型可以改变 不像c语言
科学计数法 xey 代表x乘10的y次方
布尔值：true 或 false
数组用方括号书写 用逗号分隔 下标从0开始
对象用花括号书写 name:value 用逗号分隔 类似于C语言中的结构体
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
typeof运算符返回变量或者表达式的类型
任何变量均可通过设置值为 undefined 进行清空
null 与 undefined 值相等，但是类型不相等
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true
JavaScript 函数通过 function 关键词进行定义，其后是函数名和括号 ()。
函数名可包含字母、数字、下划线和美元符号（规则与变量名相同）。
圆括号可包括由逗号分隔的参数：
由函数执行的代码被放置在花括号中：{}
函数参数是在函数定义中所列的名称。
函数参数是当调用函数时由函数接收的真实的值。
var x = myFunction(4, 3); // 调用函数，返回值被赋值给 x
function myFunction(a, b) {
return a * b; // 函数返回 a 和 b 的乘积
}
在 JavaScript 函数中声明的变量，会成为函数的局部变量。
局部变量只能在函数内访问。
由于局部变量只能被其函数识别，因此可以在不同函数中使用相同名称的变量。
局部变量在函数开始时创建，在函数完成时被删除。
JS中 变量是数据值的容器。对象也是变量，但是对象包含很多值。用名称:值的方式书写
对象是被命名值的容器
名称:值 被称为属性
对象可以有方法 方法是在对象上执行的动作 方法以函数定义被存储在属性中
var person = {
firstName: "Bill",
lastName : "Gates",
id : 678,
fullName : function() { //方法
return this.firstName + " " + this.lastName;
}
};
在函数定义中，this 引用该函数的“拥有者”。
在上面的例子中，this 指的是“拥有” fullName 函数的 person 对象。
换言之，this.firstName 的意思是 this 对象的 firstName 属性。
访问对象属性：
objectName.propertyName (点号)
objectName["propertyName"] (方括号加双引号)
访问对象方法 如果您不使用 () 访问 fullName 方法，则将返回函数定义：
objectName.methodName()
name = person.fullName();
不要把字符串、数值和布尔值声明为对象 会增加代码的复杂性并降低执行速度
如果通过关键词"new"来声明变量，则该变量会被创建为对象
HTML 事件是发生在 HTML 元素上的“事情”。
当在 HTML 页面中使用 JavaScript 时，JavaScript 能够“应对”这些事件。
| 事件 | 描述 |
|---|---|
| onchange | HTML 元素已被改变 |
| onclick | 用户点击了 HTML 元素 |
| onmouseover | 用户把鼠标移动到 HTML 元素上 |
| onmouseout | 用户把鼠标移开 HTML 元素 |
| onkeydown | 用户按下键盘按键 |
| onload | 浏览器已经完成页面加载 |
var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;
转义字符 \
| 代码 | 结果 | 描述 |
|---|---|---|
| ‘ | ‘ | 单引号 |
| " | " | 双引号 |
| \ | \ | 反斜杠 |
其他六个 JavaScript 中有效的转义序列：
| 代码 | 结果 |
|---|---|
| \b | 退格键 |
| \f | 换页 |
| \n | 新行 |
| \r | 回车 |
| \t | 水平制表符 |
| \v | 垂直制表符 |
这六个转义字符最初设计用于控制打字机、电传打字机和传真机。它们在 HTML 中没有任何意义。
对长字符串换行的最安全做法（但是有点慢）是使用字符串加法：
document.getElementById("demo").innerHTML = "Hello" +
"Kitty!";
请注意 (xy) 与 (x=y) 的区别。
JavaScript 对象无法进行对比，比较两个 JavaScript 将始终返回 false。
length 属性返回字符串的长度
查找字符串中的字符串
indexOf()方法返回字符串中指定文本首次出现的位置 (下标从0开始)
lastIndexOf()方法返回指定文本在字符串最后一次出现的位置
如果找不到文本 都返回-1
var str = "The full name of China is the People‘s Republic of China.";
var pos = str.indexOf("China");
两种方法都接受作为检索起始位置的第二个参数
lastIndexOf() 方法向后进行检索（从尾到头），这意味着：假如第二个参数是 50，则从位置 50 开始检索，直到字符串的起点。
var str = "The full name of China is the People‘s Republic of China.";
var pos = str.indexOf("China", 18);
检索字符串中的字符串
search()方法搜索特定值的字符串 并返回匹配的位置
var str = "The full name of China is the People‘s Republic of China.";
var pos = str.search("locate");
两种方法，indexOf() 与 search()，是相等的？
这两种方法是不相等的。区别在于：
提取字符串
slice() 提取字符串的某个部分并在新字符串中返回被提取的部分。
该方法设置两个参数：起始索引（开始位置），终止索引（结束位置）。
这个例子裁剪字符串中位置 7 到位置 13 的片段：
var str = "Apple, Banana, Mango";
var res = str.slice(7,13);
? 如果某个参数为负 则从字符串的结尾开始计数
? 如果忽略第二个参数，则裁剪字符串的剩余部分
substring() 类似于 slice()。
不同之处在于 substring() 无法接受负的索引。
substr() 类似于 slice()。
不同之处在于第二个参数规定被提取部分的长度。
如果首个参数为负，则从字符串的结尾计算位置
第二个参数不能为负，因为长度不能为负
替换字符串内容
replace()用另一值替换在字符串中指定的值
str = "Please visit Microsoft!";
var n = str.replace("Microsoft", "W3School");
replace() 方法不会改变调用它的字符串。它返回的是新字符串。
默认地，replace() 只替换首个匹配：
默认地，replace() 对大小写敏感。
如需执行大小写不敏感的替换，请使用正则表达式 /i（大小写不敏感）：
str = "Please visit Microsoft!";
var n = str.replace(/MICROSOFT/i, "W3School");
请注意正则表达式不带引号。
如需替换所有匹配，请使用正则表达式的 g 标志（用于全局搜索）：
str = "Please visit Microsoft and Microsoft!";
var n = str.replace(/Microsoft/g, "W3School");
切换大小写
toUpperCase()把字符换转换为大写；
toLowerCase()把字符串转换为小写；
var text1 = "Hello World!"; // 字符串
var text2 = text1.toUpperCase(); // text2 是被转换为大写的 text1
连接字符串
concat()连接两个或多个字符串
concat()方法可代替 + 运算符
var text1 = "Hello";
var text2 = "World";
text3 = text1.concat(" ",text2);
所有字符串方法都会返回新字符串。它们不会修改原始字符串。
正式地说：字符串是不可变的：字符串不能更改，只能替换。
trim()方法删除字符串两端的空白符
var str = " Hello World! ";
alert(str.trim());
提取字符串字符
这是两个提取字符串字符的安全方法：
charAt() 方法返回字符串中指定下标（位置）的字符串：
var str = "HELLO WORLD";
str.charAt(0); // 返回 H
charCodeAt() 方法返回字符串中指定索引的字符 unicode 编码：
var str = "HELLO WORLD";
str.charCodeAt(0); // 返回 72
字符串转换为数组
可以通过 split() 将字符串转换为数组：
var txt = "a,b,c,d,e"; // 字符串
txt.split(","); // 用逗号分隔
txt.split(" "); // 用空格分隔
txt.split("|"); // 用竖线分隔
如果省略分隔符，被返回的数组将包含 index [0] 中的整个字符串。
如果分隔符是 ""，被返回的数组将是间隔单个字符的数组：
var txt = "Hello"; // 字符串
txt.split(""); // 分隔为字符
JavaScript 数值始终是 64 位的浮点数
整数（不使用指数或科学计数法）会被精确到 15 位。
小数的最大数是 17 位，但是浮点的算数并不总是 100% 精准：
将小数计算转化为整数计算会更为精确
加号即使运算符又是级联运算符 要注意数字和字符串混合时级联问题
其他运算符会将字符串转换为数字再进行数字计算
NaN 属于 JavaScript 保留词，指示某个数不是合法数。
尝试用一个非数字字符串进行除法会得到 NaN（Not a Number）
var x = 100 / "Apple"; // x 将是 NaN（Not a Number）
可使用全局 JavaScript 函数 isNaN() 来确定某个值是否是数：
var x = 100 / "Apple";
isNaN(x); // 返回 true，因为 x 不是数
要小心 NaN。假如您在数学运算中使用了 NaN，则结果也将是 NaN：
NaN 是数，typeof NaN 返回 number：
Infinity （或 -Infinity）是 JavaScript 在计算数时超出最大可能数范围时返回的值。
除以 0（零）也会生成 Infinity
Infinity 是数：typeOf Infinity 返回 number。
JavaScript 会把前缀为 0x 的数值常量解释为十六进制。
绝不要用前导零写数字（比如 07）。
一些 JavaScript 版本会把带有前导零的数解释为八进制。
默认地，Javascript 把数显示为十进制小数。
但是您能够使用 toString() 方法把数输出为十六进制、八进制或二进制。
var myNumber = 128;
myNumber.toString(16); // 返回 80
myNumber.toString(8); // 返回 200
myNumber.toString(2); // 返回 10000000
toString() 以字符串返回数值。
所有数字方法可用于任意类型的数字（字面量、变量或表达式）：
var x = 123;
x.toString(); // 从变量 x 返回 123
(123).toString(); // 从文本 123 返回 123
(100 + 23).toString(); // 从表达式 100 + 23 返回 123
oExponential() 方法
toExponential() 返回字符串值，它包含已被四舍五入并使用指数计数法的数字。
参数定义小数点后的字符数：
var x = 9.656;
x.toExponential(2); // 返回 9.66e+0
x.toExponential(4); // 返回 9.6560e+0
x.toExponential(6); // 返回 9.656000e+0
toFixed() 返回字符串值，它包含了指定位数小数的数字：
var x = 9.656;
x.toFixed(0); // 返回 10
x.toFixed(2); // 返回 9.66
x.toFixed(4); // 返回 9.6560
x.toFixed(6); // 返回 9.656000
toFixed(2) 非常适合处理金钱。
toPrecision() 返回字符串值，它包含了指定长度的数字：
var x = 9.656;
x.toPrecision(); // 返回 9.656
x.toPrecision(2); // 返回 9.7
x.toPrecision(4); // 返回 9.656
x.toPrecision(6); // 返回 9.65600
valueOf() 以数值返回数值：
var x = 123;
x.valueOf(); // 从变量 x 返回 123
(123).valueOf(); // 从文本 123 返回 123
(100 + 23).valueOf(); // 从表达式 100 + 23 返回 123
变量转换为数字
这三种 JavaScript 方法可用于将变量转换为数字：
这些方法并非数字方法，而是全局 JavaScript 方法。
全局方法
JavaScript 全局方法可用于所有 JavaScript 数据类型。
这些是在处理数字时最相关的方法：
| 方法 | 描述 |
|---|---|
| Number() | 返回数字，由其参数转换而来。 |
| parseFloat() | 解析其参数并返回浮点数。 |
| parseInt() | 解析其参数并返回整数。 |
Number() 可用于把 JavaScript 变量转换为数值：
若无法转换数字 则返回NaN
x = true;
Number(x); // 返回 1
x = false;
Number(x); // 返回 0
x = new Date();
Number(x); // 返回 1404568027739
x = "10"
Number(x); // 返回 10
x = "10 20"
Number(x); // 返回 NaN
Number()还可以把日期转换为数字
parseInt() 解析一段字符串并返回数值。允许空格。只返回首个数字：
parseInt("10"); // 返回 10
parseInt("10.33"); // 返回 10
parseInt("10 20 30"); // 返回 10
parseInt("10 years"); // 返回 10
parseInt("years 10"); // 返回 NaN
parseFloat() 解析一段字符串并返回数值。允许空格。只返回首个数字：
parseFloat("10"); // 返回 10
parseFloat("10.33"); // 返回 10.33
parseFloat("10 20 30"); // 返回 10
parseFloat("10 years"); // 返回 10
parseFloat("years 10"); // 返回 NaN
数值属性
| 属性 | 描述 |
|---|---|
| MAX_VALUE | 返回 JavaScript 中可能的最大数。 |
| MIN_VALUE | 返回 JavaScript 中可能的最小数。 |
| NEGATIVE_INFINITY | 表示负的无穷大（溢出返回）。 |
| NaN | 表示非数字值（"Not-a-Number"）。 |
| POSITIVE_INFINITY | 表示无穷大（溢出返回）。 |
数字属性属于名为 number 的 JavaScript 数字对象包装器。
这些属性只能作为 Number.MAX_VALUE 访问。
使用 myNumber.MAX_VALUE，其中 myNumber 是变量、表达式或值，将返回 undefined
创建数组
var array-name = [item1, item2, ...];
var cars = new Array("Saab", "Volvo", "BMW");
建议使用第一种
访问数组元素 通过下标
访问完整数组 引用数组名
var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
数组是一种特殊类型的对象 使用typeof会返回object
数组使用数字来访问其元素
对象使用名称来访问其成员
JavaScript 变量可以是对象。数组是特殊类型的对象。
正因如此，您可以在相同数组中存放不同类型的变量。
您可以在数组保存对象。您可以在数组中保存函数。你甚至可以在数组中保存数组：
length属性返回数组的长度（数组元素的个数）
遍历数组的最安全的方法是使用for循环
var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
也可以使用Array.foreach()函数
var fruits, text;
fruits = ["Banana", "Orange", "Apple", "Mango"];
text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";
function myFunction(value) {
text += "<li>" + value + "</li>";
}
添加数组元素 push()
返回新数组的长度
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon"); // 向 fruits 添加一个新元素 (Lemon)
fruits[fruits.length] = "Lemon" //或使用下标
toString()把数组转换为逗号分隔的字符串
join()方法可以将所有数组元素结合为一个字符串 但是可以规定分隔符
var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");
pop() 从数组中删除最后一个元素
pop() 返回的是被删除的值
位移元素
位移与弹出等同，但处理首个元素而不是最后一个。
shift() 方法会删除首个数组元素，并把所有其他元素“位移”到更低的索引。
返回被弹出的字符串
unshift() 方法（在开头）向数组添加新元素，并“反向位移”旧元素：
返回新数组的长度
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon"); // 向 fruits 添加新元素 "Lemon"
更改元素 通过下标更改
删除元素
使用 delete 会在数组留下未定义的空洞。请使用 pop() 或 shift() 取而代之。
拼接数组 splice()方法
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
第一个参数（2）定义了应添加新元素的位置（拼接）。
第二个参数（0）定义应删除多少元素。
其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。
splice() 方法返回一个包含已删除项的数组：
合并（连接）数组concat() 返回一个新数组
裁剪数组 slice()
可接受两个参数 该方法会从开始参数选取元素，直到结束参数（不包括）为止。
如果忽略第二个参数 就是切除数组的剩余部分
sort() 以字母顺序对数组进行排序
reverse()反转数组元素 先sort再reverse就是对数组进行降序排序
对于数字排序 如果按大小排序 需要使用比值函数
function(a, b){return a-b}
以随机顺序排序数组
可以使用 Math.max.apply 来查找数组中的最高值：
function myArrayMax(arr) {
return Math.max.apply(null, arr);
}
可以使用 Math.min.apply 来查找数组中的最低值：
function myArrayMin(arr) {
return Math.min.apply(null, arr);
}
自制方法
function myArrayMax(arr) {
var len = arr.length
var max = -Infinity;
while (len--) {
if (arr[len] > max) {
max = arr[len];
}
}
return max;
}
function myArrayMin(arr) {
var len = arr.length
var min = Infinity;
while (len--) {
if (arr[len] < min) {
min = arr[len];
}
}
return min;
}
forEach() 方法为每个数组元素调用一次函数（回调函数）。
map() 方法通过对每个数组元素执行函数来创建新数组。
map() 方法不会对没有值的数组元素执行函数。
map() 方法不会更改原始数组。
filter() 方法创建一个包含通过测试的数组元素的新数组。
reduce() 方法在每个数组元素上运行函数，以生成（减少它）单个值。
reduce() 方法在数组中从左到右工作。另请参见 reduceRight（）。
reduce() 方法不会减少原始数组。
reduceRight() 方法在每个数组元素上运行函数，以生成（减少它）单个值。
reduceRight() 方法在数组中从左到右工作。另请参见 reduce（）。
reduceRight() 方法不会减少原始数组。
every() 方法检查所有数组值是否通过测试。
some() 方法检查某些数组值是否通过了测试。
indexOf() 方法在数组中搜索元素值并返回其位置。
创建Date对象
Date 对象由新的 Date() 构造函数创建。
有 4 种方法创建新的日期对象：
JavaScript 从 0 到 11 计算月份。
一月是 0。十二月是11
一位和两位数年份将被解释为 19xx 年
JavaScript 将日期存储为自 1970 年 1 月 1 日 00:00:00 UTC（协调世界时）以来的毫秒数。
零时间是 1970 年 1 月 1 日 00:00:00 UTC。
new Date(milliseconds) 创建一个零时加毫秒的新日期对象：
有四种 JavaScript 日期输入格式：
| 类型 | 实例 |
|---|---|
| ISO 日期 | "2018-02-19" （国际标准） |
| 短日期 | "02/19/2018" 或者 "2018/02/19" |
| 长日期 | "Feb 19 2018" 或者 "19 Feb 2019" |
| 完整日期 | "Monday February 25 2015" |
无论输入格式如何，JavaScript 默认将输出全文本字符串格式：
Mon Feb 19 2018 06:00:00 GMT+0800 (中国标准时间)
原文：https://www.cnblogs.com/myqD-blogs/p/12926393.html