JS学习
1.系统分硬件和软件
硬件是我们能看到的 输入设备 输出设备 CPU 硬盘 内存
而软件我们摸不到 分为系统软件（Windows、Linux、macOS）和应用软件 （浏览器、QQ、VSCODE、Sublime、Word。。。）
2.js能改变css的属性
<button type="button" onclick='document.getelementById("demo").innerHTML="Hello JavaScript!"'>点击我！</button>
<button type="button" onclick='document.getelementById("demo").style.fontSize="20px"'>点击我！</button>
<button type="button" onclick='document.getelementById("demo").style.display="blocks"'>点击我！</button>
3.外部 JavaScript 的优势
在外部文件中放置脚本有如下优势：
- 分离了 HTML 和代码
- 使 HTML 和 JavaScript 更易于阅读和维护
- 已缓存的 JavaScript 文件可加速页面加载
4.JS显示方案
使用window.alter()写入警告框 弹出警告框
使用innerHTML写入HTML元素 改变了现有元素的内容
使用console.log()写入浏览器控制台 内容在控制台输出
document.write()写入HTML输出 直接输出
5.JavaScript 语句由以下构成：
值、运算符、表达式、关键词和注释。
6.break:跳出循环
continue：跳出本次循环
do...while 要先走一遍do循环体内的代码，然后在与while里面的条件进行判断，成立循环就一直继续下去，不成立就跳出循环。循环体内代码至少被执行一次。
function 声明函数
return 退出函数
var 声明变量
switch 标记需要执行的语句块
7.js命名规则
命名可由字母、数字、下划线、美元符号组成
其中首字符只能由 字母、下划线_和美元符号$组成
js对大小写敏感 ：驼峰命名法 例如 firstName
保留字（比如js的关键词）无法用作变量名称
8.js注释
//单行注释
/* */多行注释
9.=和==的区别
=是赋值运算符
==是等于运算符
==左右值相等 就为true === 左右的类型一致才为true
10.字符串用单引号或双引号包含。
不带有值的变量，他的值是undefined
11.var、let、const的区别
var 是全局作用域和函数作用域 let和const是块作用域
var 变量能提升，而let和const不可以
var 可重复赋值，let不可以，var不能修改值
var 关键词定义的全局变量属于 window 对象：let 关键词定义的全局变量不属于 window 对象：var 重新声明一个 let 变量是不允许的：let 、const重新声明变量是允许的：// 您可以创建 const 对象：
const car = {type:"porsche", model:"911", color:"Black"};
// 您可以更改属性：
car.color = "White";
// 您可以添加属性：
car.owner = "Bill";
12.js算术运算符
| == | 等于 |
| === | 等值等型 |
| != | 不相等 |
| !== | 不等值或不等型 |
| >= | 大于或等于 |
| <= | 小于或等于 |
| ? | 三元运算符 |
| && | 逻辑与 |
| || | 逻辑或 |
| ! | 逻辑非 |
| typeof | 返回变量的类型。 |
| instanceof | 返回 true，如果对象是对象类型的实例。 |
实例
| 操作 | 结果 | 等同于 | 结果 |
|---|---|---|---|
| 5 & 1 | 1 | 0101 & 0001 | 0001 |
| 5 | 1 | 5 | 0101 | 0001 | 0101 |
| 5 ^ 1 | 4 | 0101 ^ 0001 | 0100 |
| ~ 5 | 10 | ~0101 | 1010 |
| 5 << 1 | 10 | 0101 << 1 | 1010 |
| 5 >> 1 | 2 | 0101 >> 1 | 0010 |
| 5 >>> 1 | 2 | 0101 >>> 1 | 0010 |
| 运算符 | 名称 | 描述 |
|---|---|---|
| & | AND | 如果两位都是 1 则设置每位为 1 |
| | | OR | 如果两位之一为 1 则设置每位为 1 |
| ^ | XOR | 如果两位只有一位为 1 则设置每位为 1 |
| ~ | NOT | 反转所有位 |
| << | 零填充左位移 | 通过从右推入零向左位移，并使最左边的位脱落。 |
| >> | 有符号右位移 | 通过从左推入最左位的拷贝来向右位移，并使最右边的位脱落。 |
| >>> | 零填充右位移 | 通过从左推入零来向右位移，并使最右边的位脱落。 |
13.**是幂运算 例如 var x = 3**2; console.log(x); //9
x ** y 产生的结果与 Math.pow(x,y) 相同:
i++是先赋值再加 ，++i是先加一再赋值
14.JS数据类型
数值、字符串值""、数组[]、对象{}
值的运算顺序不同，所得出来的结果也不同。
字符串被引号包围，单引号内是双引号，双引号内是单引号。
js只有一种数据类型，写数值时用不用小数均可 ，24和24.00最终都输出24
过大值用科学计数法来描述 123e5 = 12300000 123e-5 = 0.00123
15.判断数据类型
typeof和instanceof
用typeof能进行判断 number、string、boolean、undefined、function、object
其中空值不代表undefined，空值也有值，且返回的类型是String var car = ""; // 值是 ""，类型是 "string"
typeof 运算符把对象、数组或 null 返回 object。
typeof 运算符不会把函数返回 object。
var person = null; // 值是 null，但是类型仍然是对象Object
instanceof的内部实现机制是：通过判断对象的原型链上是否能找到对象的prototype，来确定instanceof的返回值
16.Undefined 与 Null 的区别
Undefined 与 null 的值相等，但类型不相等：
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true
17.函数
函数名可包含数字、字母、下划线和美元符号
function 函数名(参数1，参数2，参数3){
要执行的代码
}
函数调用情况 1.当事件发生时（当用户点击按钮时）
2.当JavaScript代码调用时
3.自动的（自调用）
函数返回
当 JavaScript 到达 return 语句，函数将停止执行。
如果函数被某条语句调用，JavaScript 将在调用语句之后“返回”执行代码。
函数通常会计算出返回值。这个返回值会返回给调用者：
访问没有 () 的函数将返回函数定义：
在 JavaScript 函数中声明的变量，会成为函数的局部变量。
局部变量在函数开始时创建，在函数完成时被删除！！！
18.js对象
js对象中的值对被称为属性
19访问对象属性 1.objectName.propertyName 2.objectName["propertyName"]
例如：person.lastName; person["lastName"];
20.访问对象方法 objectName.methodName()
例如：name = person.fullname();
请避免字符串、数值或逻辑对象。他们会增加代码的复杂性并降低执行速度。
21.js事件
常见的HTML事件
| onchange | HTML 元素已被改变 |
| onclick | 用户点击了 HTML 元素 |
| onmouseover | 用户把鼠标移动到 HTML 元素上 |
| onmouseout | 用户把鼠标移开 HTML 元素 |
| onkeydown | 用户按下键盘按键 |
| onload | 浏览器已经完成页面加载 |
22.js字符串
字符串的长度 内建属性 length 可返回字符串的长度：
var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length; s1.length
23.\ 转义字符。
| \' | ' | 单引号 |
| \" | " | 双引号 |
| \\ | \ | 反斜杠 |
var x = "中国是瓷器的故乡，因此 china 与\"China（中国）\"同名。"
输出 中国是瓷器的故乡，因此 china 与"China（中国）"同名。
在字符串中换行，通过一个反斜杠即可 （加号也可以）
24.查找字符串中的字符串
indexOf() 方法返回字符串中指定文本首次出现的索引（位置）：
lastIndexOf() 方法返回指定文本在字符串中最后一次出现的索引：
一定要注意 查询时 关键字的大小写 若书写错误则会报错
如果未找到文本， indexOf() 和 lastIndexOf() 均返回 -1。
lastIndexOf() 方法向后进行检索（从尾到头），这意味着：假如第二个参数是 50，则从位置 50 开始检索，直到字符串的起点。 50个字符内最远的
25.search() 方法搜索特定值的字符串，并返回匹配的位置：
var pos = str.search("locate");
indexOf() 与 search()，是相等的。
这两种方法是不相等的。区别在于：
- search() 方法无法设置第二个开始位置参数。
- indexOf() 方法无法设置更强大的搜索值（正则表达式）。
26.提取部分字符串
有三种提取部分字符串的方法：
- slice(start, end)
slice()提取字符串的某个部分并在新字符串中返回被提取的部分 [ ）这样取值 如果某个参数为负，则从字符串的结尾开始计数。 如果省略第二个参数，则该方法将裁剪字符串的剩余部分：规定裁剪数字处后都保留 -
var str = "Apple, Banana, Mango"; var res = str.slice(7,13); //Banana 7~13 是 7个-1 - substring(start, end)
substring()无法接受负的索引。其余的和slice一样。 - substr(start, length) 第二个参数规定被提取部分的长度。
replace(旧值，新值) 方法用另一个值替换在字符串中指定的值：默认地，replace() 只替换首个匹配：
正则表达式 /i（大小写不敏感）：解决大小写的替换。
str = "Please visit Microsoft!";
var n = str.replace(/MICROSOFT/i, "W3School");
27.toUpperCase() 把字符串转换为大写： toLowerCase转换为小写
trim() 方法删除字符串两端的空白符： alert(str1.trim())
concat() 连接两个或多个字符串：var text = "Hello".concat(" ","World!");
28.提取字符串字符
这是两个提取字符串字符的安全方法：
- charAt(position)
charAt()方法返回字符串中指定下标（位置）的字符串：var str = "HELLO WORLD"; str.charAt(0); // 返回 H - charCodeAt(position)
charCodeAt()方法返回字符串中指定索引的字符 unicode 编码：var str = "HELLO WORLD"; str.charCodeAt(0); // 返回 72
如果找不到字符，[ ] 返回 undefined，而 charAt() 返回空字符串。
29.把字符串转换为数组
可以通过 split() 将字符串转换为数组：
30.JS字符串搜索
- String.indexOf() 如果第二个参数是
15，则从位置 15 开始搜索，一直搜索到字符串的开头。 - String.lastIndexOf()
- String.startsWith() 以规定的字符开始，则返回true
- String.endsWith() 以固定字符结尾，则返回true
31.match() 方法根据正则表达式在字符串中搜索匹配项，并将匹配项作为 Array 对象返回。
如果字符串包含指定值，includes() 方法返回 true。
String.includes()
let text = "Hello world, welcome to the universe."; text.includes("world") // 返回 true
String.startsWith()
如果字符串以指定值开头，则 startsWith() 方法返回 true，否则返回 false：
32.模板字面量使用反引号 (``) 而不是引号 ("") 来定义字符串：
通过使用模板字面量，您可以在字符串中同时使用单引号和双引号：
模板字面量允许多行字符串：let text = `He's often called "Johnny"`;
模板字面量允许字符串中的变量：
模板字面量允许字符串中的表达式：
33.小数的最大数是 17 位，但是浮点的算数并不总是 100% 精准：
var x = 10;
var y = 20;
var z = "The result is: " + x + y; //The result is: 1020
34.JavaScript 会尝试将字符串转换为数字：
var x = "100";
var y = "10";
var z = x / y; // z 将是 10
var x = "100";
var y = "10";
var z = x * y; //1000
35.NAN-非数值
isNaN() 来确定某个值是否是数：
var x = 100 / "Apple";
isNaN(x); // 返回 true，因为 x 不是数
var x = NaN;
var y = 5;
var z = x + y; // z 将是 NaN
var x = NaN;
var y = "5";
var z = x + y; // z 将是 NaN5
NaN 是数，typeof NaN 返回 number：35.Infinity （或 -Infinity）是 JavaScript 在计算数时超出最大可能数范围时返回的值
除以 0（零）也会生成 Infinity：typeof Infinity; // 返回 "number"
36.toString() 方法把数输出为十六进制、八进制或二进制。
var myNumber = 128;
myNumber.toString(16); // 返回 80
myNumber.toString(8); // 返回 200
myNumber.toString(2); // 返回 10000000
37.数值可以是对象
var x = 123;
var y = new Number(123);
// typeof x 返回 number
// typeof y 返回 object
38.toString() 以字符串返回数值。
39.toExponential() 返回字符串值，它包含已被四舍五入并使用指数计数法的数字。
var x = 9.656;
x.toExponential(2); // 返回 9.66e+0
x.toExponential(4); // 返回 9.6560e+0
x.toExponential(6); // 返回 9.656000e+0
40.toFixed() 返回字符串值，它包含了指定位数小数的数字：
var x = 9.656;
x.toFixed(0); // 返回 10
x.toFixed(2); // 返回 9.66
x.toFixed(4); // 返回 9.6560
x.toFixed(6); // 返回 9.656000
41.toPrecision() 返回字符串值，它包含了指定长度的数字：
var x = 9.656;
x.toPrecision(); // 返回 9.656
x.toPrecision(2); // 返回 9.7
x.toPrecision(4); // 返回 9.656
x.toPrecision(6); // 返回 9.65600
42.valueOf() 以数值返回数值：
(100 + 23).valueOf(); // 从表达式 100 + 23 返回 123
43.把变量转换为数值：
| Number() | 返回数字，由其参数转换而来。 |
| parseFloat() | 解析其参数并返回浮点数。 |
| parseInt() | 解析其参数并返回整数。 |
44.Number() 可用于把 JavaScript 变量转换为数值：
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
45.parseInt() 解析一段字符串并返回数值。允许空格。只返回首个数字：
parseInt("10"); // 返回 10
parseInt("10.33"); // 返回 10
parseInt("10 20 30"); // 返回 10
parseInt("10 years"); // 返回 10
parseInt("years 10"); // 返回 NaN
46.parseFloat() 解析一段字符串并返回数值。允许空格。只返回首个数字：
