文章目录
js简介
- js也是一门面向对象编程语言 它也是可以写后端的。
- js跟java一毛钱关系没有 存粹是为了蹭当时java的热度
JS版本
主要还是用的5.1 和 6.0
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入HTML页码的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScript 很容易学习
* js 的注释
'''
// 单行注释
/*
多行注释1
多行注释2
多行注释3
*/
'''
* 两种引入方式
1.script标签内部直接书写js代码
2.script标签src书写引入外部js代码
* js语法结构
js是以分号作为语句的结束
但是如果你不写分号，也能够正常执行 但是它相当于没有结束符
js学习流程
- 变量
- 数据类型
- 流程控制
- 函数
- 对象
- 内置方法/模块
变量
1. 关键字var
var name='jason'
2. es6推出的新语法
let name='jason'
如果你的编辑器支持的版本是5.1那么无法使用let
而如果是6.0则向下兼容 var let 都可以用
# var与let的区别
var 定义的变量 当for循环中由相同的变量 那么for循环中的变量进行改变后会覆盖掉var定义的变量
反之let不会
常量
# js中是有真正意义上的常量的
const pi = 3.14
js变量的命名规范
1.变量名只能是
数字 字母 下划线 $
2.变量命名规范
1.js中推荐使用驼峰式命名
userName
dataOfDb
2.python推荐使用下划线的方式
user_name
data_of_db
3.不能使用关键字作为变量
数据类型
js是一门拥有动态类型
name = 'jason'
name = 123
# name可以重新赋值且可以是任意的数据类型
# c就不具备动态类型 例如 int n = 1 那么n后面重新赋值 也就只能赋 int型数值
js代码运行 可以直接通过谷歌浏览器（打开任意一个页面 按下F12 在按Console 可以在该面板进行js代码编写，本篇代码都是在该面板上运行的
数值类型（number）
var a = 11
var b = 11.11
// 如何查看当前数据类型
typeof a;
js 中没有整数型、浮点型概念 都叫 number数值型
// 特殊的 NaN: 数值类型 表示的意思是“不是一个数值” NOT A NUMBER
parserInt('11.11') = 11
parserInt('11saf') = 11
parserInt('as11') = NaN (意思就是该数是数值类型 但是不知道是啥)
字符类型（string）
# 定义字符串 单行字符串可以用'' 或者 ""
var s = 'jason'
var c = "jason"
这样都是可以的
# 定义多行字符串 用键盘ese下面那个键括起来
// 模板字符串
var a = `
jason
egon
legon
`
// 模板字符串除了可以定义多行文本之外 还可以实现格式化字符串操作
eg: var name = "小明"
var age = "18"
var ss = " my name is ${name} and my age is ${age} ";
用 ${变量名} 可以构造模板字符串 若${}里面的变量名不存在 则会报错
# 字符串的拼接
// 在python中不推荐你使用 + 做拼接 （效率低） 推荐使用join
// 在js中推荐你直接使用+做拼接
布尔值
1.在python中布尔值是首字母大写的
True
False
2.但是在js中布尔值是全小写的
true
false
# 布尔值是false的有哪些
空字符串、0、null、undefined、NaN
null与undefined
null
表示值为空 一般都是指定或者清空一个变量时使用
name = 'jason'
name = null
undefined
表示声明了一个变量 但是没有做初始化操作（没有给值）
函数没有指定返回值的时候 返回的也是undefined
数值（类似于python里面的列表）
var l = [11,22,33]
undefined
typeof l
"object"
var ll = [11,'sdf',11.11,true] //支持存不同类型的数据
undefined
typeof ll
"object"
ll[2] = 11.11 // 支持索引取值
var l = [111,222,333,444]
undefined
l.length
4
l.push(555) // appented()
5
l
(5) [111, 222, 333, 444, 555]
l.pop() //删除尾部元素
555
l
(4) [111, 222, 333, 444]
l.unshift(000) // 在头部添加元素
5
l
(5) [0, 111, 222, 333, 444]
l.shift() // 删除头部元素
0
l.slice(0,3) // 切片操作
(3) [111, 222, 333]
l.reverse() // 倒序输出
(4) [444, 333, 222, 111]
l.join('$') // 跟python相反 python的join是 ''.join()
"444$333$222$111"
l.concat([111,222,333])
(7) [444, 333, 222, 111, 111, 222, 333]
l.sort()
(4) [111, 222, 333, 444]
ll=l.concat([111,222,333]) // python里的extend
(7) [111, 222, 333, 444, 111, 222, 333]
ll.sort()
(7) [111, 111, 222, 222, 333, 333, 444]
# 三个重要的方法
l.forEach()
forEach(function(value, index, arr){console.log(value, index, arr)},l);// 对应python里面的map方法 映射
VM1270:1 111 0 (4) [111, 222, 333, 444]
VM1270:1 222 1 (4) [111, 222, 333, 444]
VM1270:1 333 2 (4) [111, 222, 333, 444]
VM1270:1 444 3 (4) [111, 222, 333, 444]
# 最多接收三个参数 元素 + 元素索引 + 元素的数据来源
2.splice()
ll
(7) [111, 111, 222, 222, 333, 333, 444]
ll.splice(0,2) // 两个参数的时候 在0的位置开始删 删除两个元素
(2) [111, 111]
ll
(5) [222, 222, 333, 333, 444]
ll.splice(0,2,111) // 三个参数的时候 在0的位置开始删 删除两个元素 然后再在删除的地方添加 111
(2) [222, 222]
ll
(4) [111, 333, 333, 444]
3.map() // 跟forEach() 差不多的效果 只是语义不一样
var l1 = [11,22,33,44]
undefined
l1.map(function(value){console.log(value)},l1)
VM1651:1 11
VM1651:1 22
VM1651:1 33
VM1651:1 44
运算符
# 比较运算符
1 == '1' # 弱等于 内部自动转换成相同的数据类型比较了
true
1 === '1' # 强等于 内部不做自动转换了
false
# 逻辑运算符
&& 与
|| 或
! 非
5 && '5'
'5' // 5 为真 真就拿右边的值
0 || 1
1 // 1 为真 所以拿右边的值
!5 && '5'
5 // !5 为假 所以拿左边的值
流程控制
var age = 10;
# if (条件) {条件成立之后指向的代码块}
if (age>18) {
console.log('来啊')
}
# if-else
if(age>19){
console.log('来啊')
}else{
console.log('滚蛋')
}
# if、else if、else
if(age<19){
console.log('培养一下')
}else if(age<25){
console.log('小姐姐你好')
}
else{
console.log('你是个好人')
}
# 在js中代码是没有缩进的
()条件
{}代码块
# switch语法 // 跟c一样
var num = 2;
switch(num){
case 0:
console.log('喝酒');
break;
case 1:
console.log('唱歌');
break;
case 2:
console.log('洗脚');
break;
case 3:
console.log('按摩');
break;
}
# 三元运算符
# python中三元运算符 res = 1 if 1>2 else 3
# JS中三元运算符 res = 1>2 ? 1:2; // 跟c 一样
函数
# 有参函数
function func2(a,b){
console.log(a,b)
}
func2(1,2)
func2(1,2,3,4) # js中参数传多没有关系
func2(1) # 传少也没有关系 会自动用undefined顶替
# 关键字 arguments
function func2(a,b){
console.log(arguments) # 能够获取到函数接收到的所有的参数
console.log(a,b)
}
function func2(a,b){
if(arguments.length<2){
console.log('传少了')
}else if (arguments.length>2){
console.log('传多了')
}else{
console.log(a,b)
}
}
# 匿名函数 // 不常用
function(){
console.log('好好好')
}
var res = function(){ // 匿名函数只能先用变量存着
console.log('好好好')
}
# 箭头函数（ 需要了解） 和上面一样 主要用来处理简单业务逻辑
# 单值
var func1 = v => v; //箭头左边的是形参 右边的是返回值
等价于
var func1 = function(v){
return v
}
# 多值
var func2 = (arg1,arg2) => arg1+arg2
等价于
var func1 = function(arg1,arg2){
return arg1+arg2
}
函数的全局变量与局部变量
与python查找变量的顺序一模一样
对象
一切皆对象
自定义对象
* 你可以看成是python中的字典 但是js中自定义的对象要比python里面的字典操作起来更加的方便
# 创建自定义对象 {}
# 第一种创建
var d1 = {'name': 'jason', 'age':18}
var d = {'name':'jason', 'age':18};
undefined
typeof d
"object"
d['name'];
"jason"
d.name; # 比python取字典的值更加的方便
"jason"
for(let i in d){
console.log(i,d[i])
} # 支持for循环
# 第二种创建自定义对象的方式 需要使用关键字 new
var d2 = new Object();
d2.name = 'jason'
d2['age'] = 18;
{name: "jason", age: 18}
Date 对象
let d3 = new Date()
Sat May 29 2021 22:47:55 GMT+0800 (中国标准时间)
d3.toLocaleDateString() // 要转换成标准格式的时间 需要用到这个方法
"2021/5/29"
# 也支持自己手动输入时间
let d4 = new Date('2200/11/11 11:22:11:22')
d4.toLocaleDateString()
"2200/11/11"
# 时间对象具体方法
let d6 = new Date();
d6.getDate() 获取月
d6.getDay() 获取星期
d6.getMonth() 获取月份(0-11)
d6.getFullYear() 获取完整的年份
d6.getHours() 获取小时
d6.getMinutes() 获取分钟
d6.getSeconds() 获取秒
d6.getMilliseconds()获取毫秒
d6.getTime() 获取时间戳
json对象
'''
在python中序列化反序列化
dumps 序列化
loads 反序列化
在js中也有序列号反序列化
JSON.stringify() 对应 dumps
JSON.parse() 对应 loads
'''
let d7 = {'name':'jason','age':18}
let res1 = JSON.stringify(d7)
"{\"name\":\"jason\",\"age\":18}"
106
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
