本文最后更新于389 天前，其中的信息可能已经过时，如有错误请发送邮件到asure_0506@foxmail.com
JavaScript简介
JavaScript是什么
JavaScript组成
ECMAScript：
规定了js基础语法核心知识，例如：变量、分支语句、循环语句、对象等等
Web APIs：
DOM：操作元素，比如对页面元素进行移动、大小、添加、删除等操作
BOM：操作浏览器，比如页面弹窗，检测窗口宽度，存储数据到浏览器等等
JavaScript书写位置
内部JavaScript
- 直接卸载html文件里，用<script></script>标签包裹
- 写在</body>前 （因为需要其他的dom加载完成才能通过js操作，所以需要写在末尾）
- 按加载顺序来写
<body>
<script>
alert("hello");
</script>
</body>外部JavaScript
<body>
<script src="./demo.js">
// 通过src引入外部js
</script>
</body>- script标签中间无需写代码，会被忽略
- 外部js文件会使得代码更加有序，也更容易复用，且没有了脚本的混杂，HTML也更加易读
内联JavaScript
<body>
<button onclick="alert('demo')"></button>
</body>- 代码写在标签内部
- vue框架会使用该模式
JavaScript输入输出语法
输出语法
向body中输出语句
<script>
/* 1.文档输出内容 */
document.write("文档输出")
/* 可以直接输出标签 */
document.write('<h1>标题1</h1>')
</script>页面弹出警告对话框
<body>
<script>
alert('警告')
</script>
</body>控制台输出语法 常用于debug
<body>
<script>
console.log(‘打印’）
</script>
</body>输入语法
显示一个对话框用于提示用户输入文字（类似于alert）
<body>
<script>
/* 1.文档输出内容 */
// document.write("文档输出")
/* 可以直接输出标签 */
// document.write('<h1>标题1</h1>')
// alert('警告')
prompt("请输入用户姓名")
</script>
</body>字面量
数字字面量 和 字符串字面量
1000 是数字字面量
‘hor1z0n’是字符字面量
变量
用于存储数据的容器（变量不是数据本身，只是一个容器）
声明变量
声明关键字+变量名（标识） let 不允许声明多个同名 变量 var可以声明多个同名变量
let 变量名获取输入并打印输出
let uname = prompt("请输入用户姓名")
document.write(uname)命名规范
- 不能用关键字 let var if for
- 只能用下划线、字母、数字、$组成，且数字不能开头
- 严格区分大小写
- 起名要有意义
- 小驼峰命名法
数组
let arr = []
//获取数组长度使用.length
let l = arr.length常量
- 使用const声明的变量成为“常量”。
- 当某个变量永远不会改变的时候就可以使用const声明，而不是let
- 命名规范与变量一致
- 常量不允许重新赋值，声明的时候必须赋值（初始化）
const PI = 3.14//不能改变数据类型
数字类型
舍入
舍入（rounding）是使用数字时最常用的操作之一。
这里有几个对数字进行舍入的内建函数：
Math.floor向下舍入：3.1 变成 3，-1.1 变成 -2。
Math.ceil向上舍入：3.1 变成 4，-1.1 变成 -1。
Math.round向最近的整数舍入：3.1 变成 3，3.6 变成 4，中间值 3.5 变成 4。
Math.trunc（IE 浏览器不支持这个方法）移除小数点后的所有内容而没有舍入：3.1 变成 3，-1.1 变成 -1。
这个是总结它们之间差异的表格：
Math.floor | Math.ceil | Math.round | Math.trunc | |
|---|---|---|---|---|
3.1 | 3 | 4 | 3 | 3 |
3.6 | 3 | 4 | 4 | 3 |
-1.1 | -2 | -1 | -1 | -1 |
-1.6 | -2 | -1 | -2 | -1 |
这些函数涵盖了处理数字小数部分的所有可能方法。但是，如果我们想将数字舍入到小数点后 n 位，该怎么办？
例如，我们有 1.2345，并且想把它舍入到小数点后两位，仅得到 1.23。
有两种方式可以实现这个需求：
- 乘除法例如，要将数字舍入到小数点后两位，我们可以将数字乘以
100，调用舍入函数，然后再将其除回。let num = 1.23456; alert( Math.round(num * 100) / 100 ); // 1.23456 -> 123.456 -> 123 -> 1.23 - 函数 toFixed(n) 将数字舍入到小数点后
n位，并以字符串形式返回结果。let num = 12.34; alert( num.toFixed(1) ); // "12.3"这会向上或向下舍入到最接近的值，类似于Math.round：let num = 12.36; alert( num.toFixed(1) ); // "12.4"请注意toFixed的结果是一个字符串。如果小数部分比所需要的短，则在结尾添加零：let num = 12.34; alert( num.toFixed(5) ); // "12.34000"，在结尾添加了 0，以达到小数点后五位我们可以使用一元加号或Number()调用，将其转换为数字，例如+ num.toFixed(5)。
Object.is()
<script>
/* 与 Object.is 进行比较
有一个特殊的内建方法 Object.is，它类似于 === 一样对值进行比较，但它对于两种边缘情况更可靠：
它适用于 NaN：Object.is(NaN, NaN) === true，这是件好事。
值 0 和 - 0 是不同的：Object.is(0, -0) === false，从技术上讲这是对的，因为在内部，数字的符号位可能会不同，即使其他所有位均为零。
在所有其他情况下，Object.is(a, b) 与 a === b 相同。
这种比较方式经常被用在 JavaScript 规范中。当内部算法需要比较两个值是否完全相同时，它使用 Object.is（内部称为 SameValue）。 */
let a = Symbol("id")
let b = Symbol("id");
alert(Object.is(a, b));
/* 控制台输出false,这说明在symbol全局注册表中，哪怕常量名是一样的，却仍然是两个东西 */
alert(Object.is(a, a));
</script>isNaN和isFinite
<script>
// isNaN(value) 将其参数转换为数字，然后测试它是否为 NaN：
alert(isNaN(""))//false
alert(isNaN(undefined))//true
// isFinite(value) 将其参数转换为数字，如果是常规数字而不是 NaN/Infinity/-Infinity，则返回 true：
// 可以用来验证字符串值是否为常规数字
alert(isFinite("15")); // true
alert(isFinite("str")); // false，因为是一个特殊的值：NaN
alert(isFinite(Infinity)); // false，因为是一个特殊的值：Infinity
</script>parseInt和parseFloat
<script>
/* 有种方法可以通过+号来对数据进行强制转换
但是由于+只能转换纯数字的字符串
类似'100px'这样的字符串就会报错
于是有了parseInt和parseFloat方法
它们可以从字符串中“读取”数字，直到无法读取为止
如果发生 error，则返回收集到的数字
函数 parseInt 返回一个整数
而 parseFloat 返回一个浮点数*/
alert(parseInt('100px')); // 100
alert(parseFloat('12.5em')); // 12.5
alert(parseInt('12.3')); // 12，只有整数部分被返回了
alert(parseFloat('12.3.4')); // 12.3，在第二个点出停止了读取
alert(parseInt('a120'));//返回一个NaN，在第一个字符是a时停止了读取
/* parseInt(str, radix) 的第二个参数
parseInt() 函数具有可选的第二个参数。它指定了数字系统的基数，因此 parseInt 还可以解析十六进制数字、二进制数字等的字符串： */
alert(parseInt('0xff', 16)); // 255
alert(parseInt('ff', 16)); // 255，没有 0x 仍然有效
alert(parseInt('2n9c', 36)); // 123456
</script>获取子字符串
slice(start, end) | 从 start 到 end（不含 end） | 允许 |
substring(start, end) | 从 start 到 end（不含 end） | 负值被视为 0 |
substr(start, length) | 从 start 开始获取长为 length 的字符串 | 允许 start 为负数 |
