一、JavaScript简述
JavaScript也是一门编程语言，有人将其简称为JS，由创造者Netscape公司1996年将其提交给国际标准化组织ECMA，希望借此成为国际标准！后来ECMA发布第一版，规定了浏览器脚本语言的标准，并将其命名为ECMAScript，这是为了避免商标纠纷！而现在因为Netscape公司早已消散，因此叫JavaScript也没关系了。它虽然有Java开头，但其实跟Java语言一毛钱关系没有，纯粹是当年蹭Java热度而命名！
JavaScript是一门面向对象的轻量级脚本语言，可插入HTML页面，以此实现动态效果，又因其较为易学，因此受到广泛欢迎！
这里顺带提一下学习一门编程语言的套路：
- 变量
- 数据类型
- 流程控制
- 函数
- 对象(不是面向对象则无)
- 内置方法、模块
二、JavaScript引入方式
JS代码引入跟CSS非常相似，可以在HTML页面的指定标签内直接书写代码，也可通过引入外部文件来导入代码！
2.1、script内直接写
这点跟CSS一样，scrip可以放head内也可以是body内，推荐body。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//在这里直接写JS代码
</script>
<style></style>
</head>
<body>
</body>
</html>
2.2、导入文件
<script src="test.js"></script>
JS代码书写位置或者说调试可以是单独开设js文件，也可以是浏览器比如Chrome的console窗口，此窗口类似terminal，实时交互！
三、JavaScript语法规范
3.1、JS注释
3.1.1、单行注释
// 单行注释
3.1.2、多行注释
/*
多行注释
*/
3.2、JS结束符
Python代码没有结束符一说，但是JS以分号作为语句的结束，你就是不写它也能执行！
3.3、变量声明
Python变量不需要事先声明，而JS是需要事先声明变量名的！
- JavaScript变量名可以是字母、数字、下划线、$组成，但不能以数字开头。
- JavaScript变量名区分大小写，且官方推荐使用驼峰体命名规范。
- 声明变量用关键字var或者let来声明。
其中var声明的变量全局有效，而let是6.0+版本后推出的，它作用于局部，这点跟Python的名称空间查找顺序是一致的！
let name = 'sanxi';
name;
"sanxi"
3.4、常量
Python中没有常量这个概念，墨守成规是纯大写的变量名当作常量来看；而JS在6.0+后推出用const，常量声明就无法更改！
const TELL_NUM = 666;
undefined
TELL_NUM = 777;
VM432:1 Uncaught TypeError: Assignment to constant variable.
at <anonymous>:1:10
四、JavaScript数据类型
查看数据类型使用关键字typeof
4.1、数值类型(number)
Python中数值类型为int，JS中为number！
let age = 18：
typeof age;
"number"
4.1.1、类型转换
取整数
parseInt('3.14159')
3
浮点
parseFloat('3.14159')
3.14159
特殊类型
parseFloat('hello')
NaN
NaN，not a number，它是数值类型，但表示的意思是“不是一个数字”，常用于表示某个值不是数字。
4.2、字符类型(string)
支持单双引号，但不支持三引号。在Python中拼接字符串不推荐使用+，推荐使用join方法，但在JavaScript推荐使用+来拼接！
字符类型常用方法
length
统计长度
let name = 'chrystal';
undefined
name.length
8
trim系列
移除空白字符
//移除空白字符
name1.trim()
"sanxi"
//移除左侧空白字符
name1.trimLeft()
"sanxi "
//移除右侧空白字符
name1.trimRight()
" sanxi"
charAt
返回索引所对应的第N个字符
name
"chrystal"
name.charAt(3)
"y"
indexOf
返回指定字符串所在索引位置
name.indexOf('t');
5
concat
字符串拼接
name.concat(name1);
"chrystal sanxi "
substring
根据索引取值，第一个参数为起始位置，第二个参数为结束位置，跟Python一样顾头不顾尾！
name.substring(5,8)
"tal"
slice
切片
name.slice(3,8)
"ystal"
toLocaleLowerCase
转成小写
let name = 'ChryStal'
undefined
name.toLocaleLowerCase()
"chrystal"
toLocaleUpperCase
转成大写
name.toLocaleUpperCase()
"CHRYSTAL"
拼接字符串补充
以下内容来自博客园：JsonJi，原地址：https://www.cnblogs.com/Dominic-Ji/p/9111021.html
string.slice(start, stop)和string.substring(start, stop)：
两者的相同点：
如果start等于end，返回空字符串
如果stop参数省略，则取到字符串末
如果某个参数超过string的长度，这个参数会被替换为string的长度
substirng()的特点：
如果 start > stop ，start和stop将被交换
如果参数是负数或者不是数字，将会被0替换
silce()的特点：
如果 start > stop 不会交换两者
如果start小于0，则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0，则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)
模板字符串
JS6以后，引入了增强版字符串：模板字符串，用``标识。它可以当成普通字符串、可以定义多行文本，还可以跟Python的%s和f''一样实现格式化字符串，需要注意的是里面引用变量跟shell一样要加$！
`${name} go out with ${name1}`
"ChryStal go out with sanxi "
4.3、布尔值(boolean)
在Python中，布尔值是首字母大写的，而在JS中布尔值是全小写的！
false值
- 空字符串
- 0、null
- undefined
- NaN
null与defined
null
表示值为空，一般都是指定或者清空一个变量时使用
name;
"ChryStal"
name = null;
null
undefined
表示声明了一个变量，但是没有做初始化操作，即没有赋值；如果函数没有指定返回值的时候，返回的也是undefined。
4.4、对象
JavaScript与Python一样都是面向对象编程，它允许自定义对象，对象是带有属性和方法的特殊数据类型！JS中数组和自定义对象统一称为object，且不支持负数索引。
4.4.1、数组
数组类似于Python的列表[]
let l1 = [11,22,33];
undefined
typeof(l1);
"object"
| JS数组方法 | 作用 | 对应Python列表方法 |
|---|---|---|
| length | 统计元素个数 | len() |
| push | 尾部添加元素 | append() |
| pop | 删除指定元素并打印其值 | pop() |
| unshift | 头部插入元素 | insert()，指定位置 |
| shift | 头部移除元素 | remove |
| slice | 切片 | : |
| sort | 排序 | sort |
| reserve | 反转排序 | reserve |
| join | 将数组元素拼接成字符串 | join，只能拼接字符串 |
forEach
将数组的元素回调给函数
let l1 = [11,22,33]
undefined
l1.forEach(function(value,index,arr){console.log(value,index,arr)},l1);
VM155:1 11 0 (3) [11, 22, 33]
VM155:1 22 1 (3) [11, 22, 33]
VM155:1
splice
删除元素并添加新元素，第一个参数为初始索引号，第二个参数为删除元素个数，第三个为可选的新添元素
l3.splice(0,3,666)
(3) [33, 55, 77]
l3
(2) [666, 99]
map
数组中的每个元素都会执行这个函数
l1.map(function(value,index){return value + 1})
(3) [12, 23, 34]
4.4.2、自定义对象
什么是自定义对象？它类似于Python的字典，但是JavaScript的只能用字符串作为键！
创建自定义对象也有两种方式：
直接写键值对
var d1 = {'name':'sanxi','age':18}
new方法
JS取值和赋值都比Python字典方便，也支持for循环。
let var2 = new Object();
undefined
var2.name = 'chrystal'
"chrystal"
4.4.3、date日期对象
let var3 = new Date();
var3.getDate() //获取当前几号
2
var3.getDay(); //获取当前星期几
2
var3.getMonth(); //获取当前月份，注意，JS奇葩，它是从0-11月份算的。
1
var3.getFullYear() //获取完整格式的年份
2021
var3.getYear() //获取短格式年份
121
var3.getHours() //获取当前几点
21
var3.getMinutes() //当前几分
10
var3.getSeconds() //当前几秒
36
var3.getTime() // 当前时间戳
1612271436294
var3.toLocaleString() // 当前本地时间
"2021/2/2下午9:10:36"
4.4.4、JSON对象
在Python中，序列化反序列化用的是dumps、loads方法；而在JS也有类似的方法，一起来看看：
stringify
类似于dumps
let obj = JSON.stringify(var2);
undefined
obj
"{"name":"chrystal","age":18}"
parse
let obj2 = JSON.parse(obj);
undefined
obj2
{name: "chrystal", age: 18}
4.4.5、RegExp(正则)对象
Python中如果需要使用正则，需要借助于re模块；JS需要创建正则对象，它有两种创建对象的方式：
new新对象
let 变量名 = new RegExp('正则表达式')
let reg = new RegExp('^[a-zA-Z][a-zA-Z0-9]{0,10}$')
undefined
reg.test('sanxi666')
true
直接赋值正则
let 变量名 = /正则表达式/
let reg2 = /^[a-zA-Z0-9]{0,10}$/
undefined
reg2.test('chrystal')
truexxxxxxxxxx5 1let reg2 = /^[a-zA-Z0-9]{0,10}$/2undefined3reg2.test('chrystal')4truereg2 = /'^a-zA-Z0-9$'/5/'^a-zA-Z0-9$'/
匹配
烦人的正则，不写了！
五、运算符
5.1、算数运算符
+ - = * / % ++ --
var x=10;
var res1=x++;
var res2=++x;
这里由于的x++和++x在出现赋值运算式，x++会先赋值再进行自增1运算，而++x会先进行自增运算再赋值！
5.2、比较运算符
> >= < <= != == === !==
1 == “1” // true 弱等于
1 === "1" // false 强等于
//JS是一门弱类型语言(会自动转换数据类型)，当你用两个等号进行比较时，JS内部会自动先将数值类型的1转换成字符串类型的1再进行比较，所以我们以后写JS涉及到比较时尽量用三等号来强制限制类型，防止判断错误！
5.3、逻辑运算符
&& || !
一定要注意什么时候返回布尔值，什么时候返回的是数据
5.4、赋值运算符
+= -= *=，和Python一样
六、流程控制
6.1、if判断
语法
if (condition) {
} else if { //类似于Python的elif
} else {
}
演示
let age = 18;
undefined
if(age>17 && age<40){console.log('青年人')}else if(age<18){console.log('少年人')}else{console.log('老年人')}
VM91:1 青年人
undefined
在JS中，代码是没有缩进一说的，我们出于Python书写习惯，可以人为加上！JS套路是小括号是条件，大括号是代码块！
6.2、switch判断
这个类似shell的case
语法格式
switch (key) {
case value:
break; //必须要break，不加break，匹配到一个后，就一直往下执行！
default: //类似于if的else
break;
}
演示
switch(day.getDate()){case 0:console.log(false);break;case 2:console.log(true);break;default:console.log('stupied');}
VM446:1 true
undefined
七、循环
7.1、for循环
语法格式
for (let index = 0; index < array.length; index++) {
const element = array[index];
}
演示
打印0-9数字
for (let index = 0; index < 10; index++) {
console.log(index);
}
VM451:2 0
VM451:2 1
VM451:2 2
VM451:2 3
VM451:2 4
VM451:2 5
VM451:2 6
VM451:2 7
VM451:2 8
VM451:2 9
undefined
循环打印出数组里每一个元素:var l1 = [11,22,33,44,55]
for(let index=0;index<l1.length;index++){console.log(l1[index]);}
VM678:1 11
VM678:1 22
VM678:1 33
VM678:1 44
VM678:1 55
undefined
7.2、while循环
语法
//while有的条件循环，for也有，所以我觉得它没价值
while (condition) {
}
八、三元表达式
JS中三元表达式，条件成立取问号后面的值，不成立取冒号后面的值，可以嵌套
var a = 1;
var b = 2;
var c = a > b ? a : b
undefined
c
2
九、函数
在Python中定义函数需要用到关键字def，JS中定义则是function。函数的全局变量与局部变量与Python名称空间顺序一致.
语法格式
function 函数名(形参...){函数体代码}
之前已经演示过了，不再演示，此处说明JS的不严谨：
参数多传没问题，只会处理对应的数据；少传了也行，用undefined顶替。。。。。。
9.1、关键字arguments
能够获取到函数接收到的所有的参数放在一个数组里面，可以配合if和length做传多传少的输出！
9.2、函数返回值
使用的也是return，如果返回多个值，则只取最后一个。
9.3、匿名函数
就是function后面不跟名字而已
9.4、箭头函数
箭头左边是形参，右边是返回值
var/let func1 = v => r;
等同于
var func1 = function(v)