一、JS介绍
是一门编程语言，可以进行逻辑运算，但是跟java没有关系 主要是为了蹭热度
全称是JavaScript,曾经叫过ECMASript，创造出这门语言的公司已经倒闭
- 完整的JavaScript 由以下三个不同的部分组成
- 核心（ECMAScript）
- 文档对象模型（DOM）
- 浏览器对象模型（BOM）
NodeJS 是能够执行js在后端服务器运行的工具
二、JS的基础
1.注释语法
// # 单行注释
/**/ # 多行注释
2.html引入JS的方式
1.在head里封script标签内直接写 # 不推荐这样
<script>
在这里写js代码
</script>
2.通过引入JS文件
<script src="js文件"></script>
3.body内最底部通过script标签src属性引入外部js资源(最常用)
# 注意：网址的读取是自上而下，所以第三种是最稳妥的，所有内容加载完了再加载动态
3.运行符号（结束符号）
分号——； 或者大多情况不用也行，直接回车
4.打印内容
console.log（） = print（）
三、如何编写JS
1.在pycharm中编写
因为Pycharm自带了JS该语言，我们可以通过查看设置找到自己的pycharm所带的JS版本，一般2018年及以后的Pycharm都是自带JS 6+
2.浏览器
因为JS所有浏览器都支持，所以可以直接在浏览器里写也是OK的
具体方法：（以谷歌浏览器为例）
任意网址空白位置右键鼠标——检查——控制台
四、JS变量与常量
在js中声明 变量 和 常量 都需要使用关键字
-
var： 全局有效
-
let： 如果在局部名称空间中使用 那么仅在局部名称空间有效
(let是ECMA6新语法)
-
const： 定义常量 定了就不能再改
五、基本数据类型
在JS中常看数据类型可以使用 typeof
1.数字类型
在JS中整型浮点型统称为数值类型number
2.字符类型
字符串 string
// 字符串 定义 有三种方法
var name = 'haha' //单引号
var name = "haha" //双引号
var name = `haha` //模板字符串
var s1 = `你好啊${name}` //格式化输出 ————${}
# 格式化输出也是ecma6的新语法
| 字符串 方法 | 功能 |
|---|---|
| .length | 返回长度 = py 的len（） |
| .trim() | 溢出空白 = py的strip（） |
| .trimLeft() | 移除左边的空白 = py的 lstrip() |
| .trimRight() | 移除右边的空白 = py的 lstrip() |
| .charAt(n) | 返回第n个字符 类似py的索引取值 |
| .concat(value) | 拼接 js中最好使用+号拼接 |
| .indexOf(from,to) | 子序列位置 = py 的find() |
| .substring(from,to) | 根据索引获取序列 |
| .slice(start,end) | 切片 顾头不顾尾 |
| .toLowerCase() | 小写 |
| .toUpperCase() | 大写 |
// .split() 切割
// （）内可以放两个元素，如果写一个元素，是按照改元素切割字符串，然后返回一个切割出的元素组成的列表，如果写两个元素，第二个元素控制你要拿几个该列表中的东西
// eg:
name
'ikun'
name.split('k')
// ['i', 'un']
name.split('k',1)
// ['i']
3.布尔值
boolean
一样的是也是true 和 false
和python不一样的是，只认小写
4.null与undefined
都标识空
null表示是空，一般是在需要指定或清空一个变量时才使用
undefined 可以理解为从来没拥有过
5.对象（object）
一切皆对象
- 数组——就是列表
//直接 生成
let l1 = [12,'kk',22,44,55]
typeof l1
'object'
| 数组方法 | 功能 | python中类似方法 |
|---|---|---|
| .length | 数组的个数 | len |
| .push(ele) | 尾部追加元素 | append |
| .pop | 获取尾部元素 | pop |
| .unshift(ele) | 头部插入元素 | insert(索引位置0，数据值) |
| .shift | 头部移除 | |
| .slice(start,end) | 切片 | [ ] |
| reverse() | 翻转 | reverse() |
| .join() | 将数组元素连接成字符串 （）内可以加元素 | join |
| .concat() | 连接数组 | extend() 拓展列表 |
| .sort() | 排序 | scort() |
| 将数组的每个元素传递给回调函数 | ||
| .splice() | 删除元素，并将数组添加新元素 | |
| .map() | 返回一个数组元素调用函数处理后的值的新数组(映射) | map() |
// .forEach()演示 需要搭配函数使用
a = [1,2,3,4,5,6]
// 一个参数
a.forEach(function(a){
console.log(a)
})
// 两个参数 第二个参数代表元素索引位置
// 三个参数 第三个参数代表元素来自哪里
// .splice()演示
// （）内，可以只写索引删除数据，也可以写了索引后再写要新加入的数据
a = [1,2,3,4,5,6]
a.splice(1,3,'hello') // 意思是，删除索引1到2的位置的元素，并且插入hello-
// >>> [1, 'hello', 5, 6]
- 自定义对象——字典
let d1 ={'name':'ikun','pwd':123}
let d2 = new object() //产生一个空字典 类似py的 = {} 关键的语法
// 获取键值对不用再用索引的方式，可以直接.
d1.name
// ikun
// 新增键值对
d1.age = 28
d1
// >>> {name: 'hahahaha', pwd: 123, age: 28}
六、运算符
1.算术运算符
++
相当于加等于1，就是自增1
// eg:
var x=10
var res1=x++; //加号 值 后面 那么 就是先赋值 在进行自增
//先res1=10 后x=11
var res2=++x; //加号在值前面 那么就是 先自增 在赋值
//先x=12 后res= 12
--
相当于减等于1,就是自减1
2.比较运算符
！= 值不等
== 值相对
== 弱等于 JS会自动 转换成相同数据类型 // eg: 1 == '1' >>>true
=== 强等于 不会自动转换 等于python中的== // eg: 1 ==='1' >>>fasle
3.逻辑运算符
| 符号 | 功能 |
|---|---|
| && | 等于python中and |
| || | 等于python中的or |
| ！ | 等于python中的not |
七、JS中的流程控制
在JS中，(){}连用意味着，()内是条件，{}内是条件成立后的代码
1.分支结构
//1.单if
if(条件){条件成立之后执行的代码}
//2.if...else分支
if(条件){
条链成立之后执行的代码
}
else{
条件不成立之后执行的代码
}
//3.if、elif、else连用
if(条件1){
条件1成立之后执行的代码
}
else if(条件2){
条件1不成立条件2成立执行的代码
}
else{
条件不成立之后执行的代码
}
// ————————————————————————————————————————————————
// switch语法 case就是条件成立的子代码，写几个就有几个分支
var day = new Date().getDay(); // 获取当前日期的星期几赋值给day
switch (day) {
case 0:
console.log('周日');
break; // 这个得加，不然会继续执行
case 1:
console.log('周一');
break
default:
console.log("...") // 条件都不满足执行的代码
}
2.循环结构
//1.for循环
// 结构： for（起始条件；循环条件；条件处理）{循环体代码}
for(let i=1;i<8;i++){
console.log(i)
}
3.while循环
while(条件){
循环体代码
}
4.三元运算
// 和PY里面的三元有区别
条件？值1:值2 条件成立就走1，不成立就走2
八、JS中函数
1.定义
function 函数名(形参){
函数体代码
return返回值
}
-
也能不编写函数名把整个函数体代码赋值给某个变量名，通过调用变量名使用函数
function(a,b){ return a +b; } -
联想其他语言函数：python>>> def() go >>>func() mysql >>>create function
2.箭头函数
简化了代码，但是也一般只能用在简单的场景
var f = function(v){
return V;
}
var f = V => V; //箭头前面 为形参 箭头指向的是返回值
// 比如，设计一个传参两个，返回求和的结果的函数
var f =(a,b) =>a+b
// 等同于var f = function(num1,num2){
return num1+num2
} //js return中只能返回一个值（如果有多个，只会返回最后一个值），如果想返回多个值需要自救手给他们包一个数组或对象
3.JS传参的特性
JS函数参数的个数 不需要一一对应 如果想要限制参数个数需要使用内置关键字 arguments
function func(a,b){
if(arguments.length===2){
console.log(a,b)
}else{
console.log('参数个数不符合')
}
}
九、JS内置对象
1.时间对象
建立对象一定是new xxx
1.获取一个时间对象——new Date()
new Date()
// >>> Mon Dec 05 2022 19:54:52 GMT+0800 (中国标准时间)
2.基于Date()对象的一些方法
.toLocaleString() // 结构化时间
.getDate/Day/Month/fullyear() // 获取日/周几/月（要+1）/年
.getTime() // 时间戳
十、JS中的JSON 序列化对象
// 序列化： JSON.stringify
let d1 = {name: 'kk', pwd: 123};
let sd1 = JSON.stringify(d1)
'{"name":"kk","pwd":123}'
// ————————————————————————————————————————————————
// 反序列化： JSON.parse
sd1 = '{"name":"kk","pwd":123}'
let d2 = JSON.parse(sd1)
{name: 'kk', pwd: 123}
十一、JS中的正则
关键字：RegExp
//方法一
let reg1 = new RegExp("^[a-zA-z][a-zA-Z0-9]{5,11}");
//方法二
let reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/;
// 注意，正则表达式中 不能有空格
// 调用校验
reg2.test()