阿里云JavaScript
JS
https://edu.aliyun.com/course/1724
https://www.w3school.com.cn/js/js_intro.asp
JavaScript 能够改变 HTML 内容
JavaScript 能够改变 HTML 属性
<p>JavaScript 能够改变 HTML 属性值。</p>
<p>在本例中，JavaScript 改变了图像的 src 属性值。</p>
<button onclick="document.getElementById('myImage').src='images/eg_bulbon.gif'">开灯
</button>
<img id="myImage" border="0" src="images/eg_bulboff.gif" style="text-align:center;">
<button onclick="document.getElementById('myImage').src='images/eg_bulboff.gif'">关灯</button>
初始状态为未开灯，点击开灯按钮显示开灯图片，点击关灯按钮显示未开灯图片。
JavaScript 能够改变 HTML 样式 (CSS)
JavaScript 能够隐藏 HTML 元素
JavaScript 能够显示 HTML 元素
快捷键
直接写在html行内
写在script标签中
将外部的JS文件引入后执行
声明变量并赋值
变量就是存储数据的容器。
关键字：数字字母下划线$
JS中变量区分大小写
数值、字符串、布尔、undefined、null、object
undefined表明一个声明了没有赋值的变量，变量只声明的时候值默认是undefined
null表示一个空，变量的值如果想为null，必须手动设置
JS数据类型
数据类型-数值和字符串
当数值和字符串相加时，JavaScript 将把数值视作字符串。
其他数据类型
代码注释
其他类型转换为字符串
s = n.toString()
console.log(typeof s);
数值类型转换
布尔类型转换
其他类型转换为数值型
布尔类型转换
JS操作符与运算符
算数操作符
一元运算符
操作符在变量前面，先进行自身运算，再进行其他运算
操作符在变量后面，先进行其他运算，再进行自身运算
逻辑运算符
| 运算符 | 描述 |
|---|---|
| && | 逻辑与 |
| || | 逻辑或 |
| ! | 逻辑非 |
比较运算符
| 运算符 | 描述 |
|---|---|
| == | 等于 |
| === | 等值等型 |
| != | 不相等 |
| !== | 不等值或不等型 |
| > | 大于 |
| < | 小于 |
| >= | 大于或等于 |
| <= | 小于或等于 |
| ? | 三元运算符 |
赋值运算符
运算符的优先级
运算优先级从上往下
1：（）优先级最高
2：一元运算符++--！
3：算数运算符（与数学中的运算先后一致）先*/%后+-
4：关系运算符><>=<=
5：相等运算符 == === ！= ！==
6：逻辑运算符先&& 后||
7：赋值运算=
JS语句
顺序结构
分支结构
循环结构
if
switch-case的用法
while
while(){
}
如果条件成立，里面的代码就会一直反复执行，直到条件不成立
do-while
先执行一次代码，然后再进行条件判断
do{}
while();
for
<script type="text/javascript">
var str = "";
for (var i=1; i<=9; i++) {
for(var j=i; j<=9; j++){
str += i+' * '+j+' = ' + (i*j) + '\t';
}
str += '\n';
}
console.log(str);
</script>
'\t'每一个式子后面加一个空格
'\n'每一行，转行
continue&break
break：立即跳出整个循环，即循怀结束，开始执行循环后面的内容（直接跳到大括号）
continue：立即跳出当前循环，继续下一次循环（跳到+的地方）
求100以内，不能被7整除的数
for (var i=0; i<100; i++) {
if(i%7==0){
continue;
}
console.log(i);
}
输出除了7的倍数以外的所有数，当数值为7的倍数时，continue跳出当前循环，继续下一次循环；
求200-300之间第一个能被7整除的数；
for (var i=200; i<300; i++) {
if(i%7==0){
console.log(i);
break;
}
}
输出203，当数值为7的倍数时，输出该值，并跳出整个循环，循环结束。
JS数组
数组的基本概念
获取数组元素
遍历数组元素
求数组元素的和
循环遍历数组
JS函数
JavaScript 函数是被设计为执行特定任务的代码块。
JavaScript 函数会在某代码调用它时被执行。
函数的声明和调用
把一段相对独立的具有特定功能的代码封装起来，重复使用；
函数声明后，里面的代码是不会执行的；
函数中的代码想要执行，必须调用这个函数（不管什么情况下，函数不调用一定不会执行）。
形参&实参
形参：是在声明函数时写的，多个形参使用，隔开，形参的值不固定，形参仅仅是一个占位，与实参实际传入的值一一对应；
实参：实际传入函数中的值，传入后，在函数中使用形参获取具体的值。
函数的返回值
如果函数中没有return，函数调用之后接到的返回值是undefined；
有return，但return后面没有值，undefined；
函数中return之后的代码，不执行。
匿名函数与自调用
立即执行函数——自调用匿名函数；
(function(){
alert(123);
})();
作用域；
防止全局变量的污染，封装一个局部作用。
函数当作参数1
函数也是一种数据类型；
对象（数组、函数）
回调。
函数当作参数2
闭包。
变量提升及代码执行阶段
变量提升：在代码执行之前变量已经在编译阶段被声明了；
JS代码的运行分为解析（编译）阶段：语法检查，变量及函数进行声明；
运行阶段：变量的赋值，代码流程的执行。
作用域与代码执行
函数与变量同名，函数声明会替换变量声明；
作用域及作用域链
全局作用域：全局（在函数之外）声明的变量拥有全局作用域；全局变量可以在任何位置访问。
代码中有函数，函数就构成另一个作用域；
函数作用域：局部（函数内）声明的变量拥有函数作用域；局部变量只能在它们被声明的函数内访问。
函数中还有函数，在这个作用域中就可以诞生一个作用域。
JS对象
对象的概述
在真实生活中，汽车是一个对象。
汽车有诸如车重和颜色等属性，也有诸如启动和停止的方法：
所有汽车都拥有同样的属性，但属性值因车而异。
所有汽车都拥有相同的方法，但是方法会在不同时间被执行。
JS的属性可以包含基本值、对象、数组或者函数；
值是函数称为方法，其他类型的值是属性；
对象的声明及使用
this是个对象
在函数定义中，this 引用该函数的“拥有者”。
this的指向
this运行在那个对象下，就指向那个对象；
对象的遍历及删除
for in循环不仅可以循环变量对象，还可以循环遍历数组
包装对象
三种原始类型
数值、字符串、布尔；
原始类型的数据在一定条件下可以自动转为对象。
原始值可以自动当作对象来调用，可以调用各种属性及方法；
如果包装对象使用完成，会自动立即销毁。
数学对象
var n = -2;
var n2 = Math.abs(n);
console.log(n2);
Math.random()函数返回一个浮点，伪随机数在范围[0,1)。
Math.floor()返回小于或等于一个给定数字的最大整数。
获取n~m之间的随机数值：
Math.random()*(m-n)+n
日期对象
var da = new Date();
console.log(da);
console.log(Date())
Fri Mar 11 2022 08:46:47 GMT+0800 (中国标准时间) 向你问早啦~
JS 获取的是计算机本地时间
数组对象
slice()方法是浅拷贝
concat()
join()
字符串对象
substr（）
代码规范
常见的 HTML 事件
| 事件 | 描述 |
|---|---|
| onchange | HTML 元素已被改变 |
| onclick | 用户点击了 HTML 元素 |
| onmouseover | 用户把鼠标移动到 HTML 元素上 |
| onmouseout | 用户把鼠标移开 HTML 元素 |
| onkeydown | 用户按下键盘按键 |
| onload | 浏览器已经完成页面加载 |
JavaScript 能够做什么？
事件处理程序可用于处理、验证用户输入、用户动作和浏览器动作：
- 每当页面加载时应该做的事情
- 当页面被关闭时应该做的事情
- 当用户点击按钮时应该被执行的动作
- 当用户输入数据时应该被验证的内容
- 等等
让 JavaScript 处理事件的不同方法有很多：
- HTML 事件属性可执行 JavaScript 代码
- HTML 事件属性能够调用 JavaScript 函数
- 您能够向 HTML 元素分配自己的事件处理函数
- 您能够阻止事件被发送或被处理
- 等等
