js介绍
是前端的一段编程语言（也是有逻辑的）
node.js 支持前端js代码跑在后端服务器上
js跟Java的关系？
半毛钱的关系都没有
原因：当初Java火 想蹭热度
js是网警公司开发的 想让索引的浏览器都支持该语言，折中 改名字 js也叫ECMAScript（两者等价）
当前使用较多的版本 ECMAScript5.1 ECMAScript6（简称ES6）
注释
单行注释： //
多行注释：
/*
*/
引入方式
1.script标签内部直接书写
<script>
alert(123)
</script>
2.通过script标签内src属性引入外部js文件
<script src="js.js"></script>
js变量
在js中声明变量需要使用关键字
变量命名规范；
1.由数字 字符 下划线 $组成,不能以数字开头
2.不能用关键字作为变量名，区分大小写
3.推荐使用驼峰体命名
python推荐使用下划线（C++）
username='jason'
js推荐使用驼峰体
userName='jason'
js代码默认以分号作为结束符,不写也没有问题
confirm('are you sure');
var与let的区别
var：声明的是全局有效
let：可以只在局部有效，let局部声明只会在局部有效，不会影响全局（ES6新语法）
var name ='jason';
let name= 'oscar';
js中有常量,const 定义正常的常量 不能修改
const PI =3.1415
js数据类型
js拥有动态类型
var x;//x是undefined
var x=1;//x是数字
var x='alex'//x是字符串
数值类型Number
js包含整形浮点型int float
var a=12.34;
var b=10;
NaN也是数值类型，但表示的意思是 不是一个数字
var a=123
parseInt(a)//123
var b='sdfgd'
parseInt(b)//NaN
var c='122axs456'
parseInt(c)//122 只要字符串里有数字就会将数字拿出来
var d='123.123.123'
parseFloat(d)//123.123
字符类型string
字符串的拼接:python 不推荐使用加好（效率极低） 用 %是format js中推荐使用加号
var a='Hello'
var b='world'
console.log(a+b)//Helloworld
常见方法：
| 方法 | 说明 |
|---|---|
| .length | 返回长度 |
| .trim() | 移除空白 |
| .trimLeft() | 移除左边空白 |
| .trimRight() | 移除右边空白 |
| .charAt(n) | 返回第n个字符 |
| .concat(value,...) | 拼接 |
| .indexOf(substring,strat) | 子序列位置 |
| .substring(from,to) | 根据索引获取子序列 |
| .slice(start,end) | 切片 |
| .toLowerCase() | 小写 |
| .toUpperCase() | 大写 |
| .split(deliniter,limit) | 分割 |
//返回长度 .length
var name='jasonjsaon'
name.length//10
//移除空白 .trim()
var name=' jason jason '
name.trim()//"jason jason"
// 返回第n个字符 .charAt(n) 根据索引取值
var name='jsaonjason'
name.charAt(3)//"o"
//子序列位置 indexOf(substring,start) 根据值找索引
var name='jsaonjason'
name.indexOf('n')//4
//拼接 .concat(value,....)
var name='jsaonjason'
name.concat('dsbdsbdsb')//"jsaonjasondsbdsbdsb"
//根据索引获取子序列 .substring(from,to)
name.substring(1,4)//"sao" 不支持负数
//分割 .split(delimiter,limit)
name.slice(1,4)//"sao"
name.slice(0,-2)//"jsaonjas"
name.slice(2)//"aonjason"
//大小写 .toLOwerCase() .toUpperCase()
var name='Kdsd'
name.toLocaleUpperCase()//"KDSD"
name.toLocaleLowerCase()//"kdsd"
如何定义多行文本
模板字符串是增强版字符串，要用反引号··
var name='nick';
var age=18
var res =`
my nageame is ${name} my age is ${age}
`/*"
my nageame is nick my age is 18
"*/
布尔值Boolean
区别于python，js中true和false都是小写的
var a=true//true
var b=false;//false
注意：空字符串，0，null,undefined,NaN都是false
null和undefined
null 表示值是空，一般在需要制定或情况一个变量时才会用到，如name=null
undefined 表示当声明一个变量但未初始化时，该变量的默认值是undefined。函数无明确返回值时，返回的也是undefined.
null表示变量的值是空（null可以手动清空一个变量的值，使得该变量变成object类型，职位null），undefined则表示只是声明了变量，但是还没赋值
对象object
数组 [] 自定义对象{}
js其实也是面向对象编程，对象只是带有属性和方法的特殊数据类型
数组
数组对象的作用是：使用单独的变量名来储存一系列的值。类似于python中的列表
| 方法 | 说明 |
|---|---|
| .length | 数组的大小 |
| .push(ele) | 尾部追加元素 |
| .pop | 获取尾部的元素 |
| .unshift(ele) | 头部插入元素 |
| .shift() | 头部移除元素 |
| .slice(start,end) | 切片 |
| .reverse() | 反转 |
| .join(seq) | 将数组元素连接成字符串 |
| .concat(val,...) | 连接数组 |
| .sort() | 排序 |
| .forEach() | 将数组的每一个元素传递给回调函数 |
| .splice() | 删除元素，并向数组添加新元素 |
| .map() | 返回一个数组元素调用函数处理后的值的新数组 |
//数组的大小 .length
var l1=[1,2,3,4,5,6,7,8,9]
l1.length//9
//尾部追加元素 .push(ele)
l1.push(666)//10
l1//(10) [1, 2, 3, 4, 5, 6, 7, 8, 9, 666]
//获取尾部的元素 .pop()
l1.pop()//666
l1//(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]
//头部插入元素 .unshift(ele)
l1.unshift(666)//10
l1//(10) [666, 1, 2, 3, 4, 5, 6, 7, 8, 9]
//头部移除元素 .shift()
l1.shift(666)//666
l1//(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]
//切片 .slice(start, end)
l1.slice(1,4)//(3) [2, 3, 4]
l1.slice(1,-1)//(7) [2, 3, 4, 5, 6, 7, 8]
//反转 .reverse()
l1.reverse()//(9) [9, 8, 7, 6, 5, 4, 3, 2, 1]
l1//(9) [9, 8, 7, 6, 5, 4, 3, 2, 1]
//将数组元素连接成字符串 .join(seq)
l1.join(',')//"9,8,7,6,5,4,3,2,1"
//连接数组 .concat(val, ...)
l1.concat([99,88,66])//(12) [9, 8, 7, 6, 5, 4, 3, 2, 1, 99, 88, 66]
l1//(9) [9, 8, 7, 6, 5, 4, 3, 2, 1]
//排序 .sort()
l1.sort()//(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]
forEach()
将数组的每个元素传递给回调函数
语法：
forEach(function(currentValue,index,arr),thisValue)
| 参数 | 说明 |
|---|---|
| currentValue | 必需。当前元素 |
| index | 可选。当前元素的索引值 |
| arr | 可选。当前元素所属的数组对象 |
| thisValue | 可选。传递给函数的值一般用“this”值。如果这个参数为空，“undefined”会传递给“this"值 |
//for循环取出每一个元素交给函数处理
var l2=[11,22,33,44,55,66]
l2.forEach(function(index,obj){
console.log(index,obj)
})/*11 0
22 1
33 2
44 3
55 4
66 5*/
splice()
删除元素，并向数组添加新元素。
语法：
splice(index,howmany,item1,...,itemx)
| 参数 | 说明 |
|---|---|
| index | 必需。规定从何处添加/删除元素。该参数是开始插入或删除的数组元素的下标，必须是数字 |
| howmany | 必须。规定应该删除多少元素。必须是数字，但可以是0.但是未规定词参数，则删除从index开始到原数组结尾的所有元素 |
| item1,...,itemx | 可选。要添加到数组的新元素 |
//第一个参数是起始位，第二个参数是删除个数，第三个参数是删除后加入的 第三个参数后有多少个就加多少个
l2//(6) [11, 22, 33, 44, 55, 66]
l2.splice(1,2)//(2) [22, 33]
l2//(4) [11, 44, 55, 66]
l2.splice(1,1,[111,222,333])//[44]
l2//(4) [11, Array(3), 55, 66]
l2.splice(1,1,888,999)//[Array(3)]
l2//(5) [11, 888, 999, 55, 66]
map
返回一个数组元素调用函数处理后的值的新数组
语法：
map(function(currentValue,index,arr),thisValues)
| 参数 | 说明 |
|---|---|
| currentValue | 必需。当前元素的值 |
| index | 可选。当前元素的索引值 |
| arr | 可选。当前严肃属于的数组对象 |
| thisValue | 可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。 如果省略了 thisValue ，"this" 的值为 "undefined" |
var l2=[11,22,33,44,55,66]
l2.map(function(value,index,arr){
return value+1
})//(6) [12, 23, 34, 45, 56, 67]
typeof用来查看数据类型的
typeof l2
python中往列表添加数据的方式：append尾部追加 insert按照索引插入 extend扩展列表
python中列表删除元素：remove（没返回值） pop（有返回值） del
运算符
算数运算符
+ - * / % ++ --
var x=10
var res1=x++//先赋值再自增
var res2=++x//先自增再赋值
res1//10
res2//12
比较运算符
> >= < <= != == === !==
1=='1'//true 弱等于 内部自动转化成相同的数据类型进行比较
1==='1'//false 强等于 不会进行数据类型的转换 直接进行比较
逻辑运算符
python js
and &&
or ||
not !
赋值运算符
= += -= *= /=
流程控制
if-else
var a=10
if (a>10){
console.log('yes')
}else{
console.log('no')
}//no
if -else if-else
var a=10
if (a>5){
console.log('a>5')
}
else if (a<5){
console.log('a<5')
}
else{
console.log('a=5')
}//a>5
switch
var day=new Date().getDay();
switch (day){
case 0:
console.log('sunday')
break
case 1:
console.log('monday')
break
default:
console.log('.....')
}//.....
for
for (var i=0;i<5;i++){
console.log(i)
}/*0
1
2
3
4*/
while
var i=0
while (i<5){
console.log(i)
i++
}/*0
1
2
3
4*/
三元运算
var a=1
var b=2
var c=a>b?a:b//这里的三元运算顺序是先写判断条件a>b再写条件成立返回的值为a，条件不成立返回的值为b；三元运算可以嵌套使用var x=a>b ?a:(b=="20")?a:b;
c//2
函数
函数定义
普通函数定义
function f1(){
console.log('hello world')
}
f1()//hello world
带参数的函数
function f2(a,b){
console.log(arguments)
console.log(arguments.length)
console.log(a,b)
}//内置的arguments接收用户传入的索引参数，组成数组
f2(1,2)/*Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ]
2
1 2*/
带返回值的函数
function sum(a,b){
return a+b
}
sum(1,2)//3
匿名函数方式
var sum=function(a,b){
return a+b
}
sum(1,2)//3
立即执行函数
书写立即执行的函数，首先先写两个括号（）（）这样防止书写混乱
(function(a,b){
return a+b
})(1,2)//3
补充
ES6中允许使用箭头（=>)定义函数
var f=v=>v
//等同于
var f=function(v){
return v
}
var f=()=>5
//等同于
var f=function(){
return 5
}
var sum=(num1,num2)=>num1+nim2
//等同于
var sum=function(num1,num2){
return num1+num2
}
函数中的arguments参数
function add(a,b){
console.log(a+b)
console.log(arguments.length)
console.log(arguments[0])//arguments相当于将传入的参数全部包含，这里取得就是一个个元素
}
add(1,2)/*3
2
1*/
注意：函数只能返回一个值，如果要返回多个值，只能将其防砸数组或者对象中返回
函数的全局变量和局部变量
局部变量
在js函数内部声明的变量（使用var)是局部变量，所以只能在函数内部访问它（该变量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除。
全局变量
在函数外声明的变量时全局变量，网页上的所有脚本和函数都能访问它
变量生存周期
js变量的生命期是从他们被声明的时间开始。局部变量会在函数运行以后被删除。全局变量会在页面关闭后被删除。
作用域
var city = "BeiJing";
function f() {
var city = "ShangHai";
function inner(){
var city = "ShenZhen";
console.log(city);
}
inner();
}
f();//ShenZhen
var city = "BeiJing";
function Bar() {
console.log(city);
}
function f() {
var city = "ShangHai";
return Bar;
}
var ret = f();
ret();//BeiJing
var city = "BeiJing";
function f(){
var city = "ShangHai";
function inner(){
console.log(city);
}
return inner;
}
var ret = f();
ret();//ShangHai
内置对象和方法
自定义对象
js对象（object）本质上是键值对的集合（Hash结构），但是只能用字符串作为键
var a={'name':'nick','age':18}
console.log(a.name)//nick
console.log(a['age'])//18
遍历对象中的内容
for (var i in a){
console.log(i,a[i])
}/*name nick
age 18*/
创建对象：
var person=new Object()//创建一个person对象
person.name='nick'
person.age=18
person//{name: "nick", age: 18}
注意：
ES6中提供了Map数据结构，他类似于对象，也是键值对的集合，但是键的范围不限于字符串，各种类型的值（包括对象）都何以作键，也就是说，Object结构提供了 字符串-值 的对应 Map结构提供了 值-值的对应，是一种更完善的Hash结构实现
var m = new Map();
var o = {p: "Hello World"}
m.set(o, "content"}//m.o='content' 好像也可以
m.get(o) // "content"//m.o好像也行
m.has(o) // true
m.delete(o) // true
m.has(o) // false
Date对象
//方法1：不指定参数
var d1=new Date()
console.log(d1.toLocaleString())//2019/11/16 下午4:30:28
d1//Sat Nov 16 2019 16:30:28 GMT+0800 (中国标准时间)
//方法2:参数为日期字符串
var d2=new Date('2004/3/20 11:12')
console.log(d2.toLocaleString())//2004/3/20 上午11:12:00
var d3=new Date('04/03/02 11:12')
console.log(d3.toLocaleString())//2002/4/3 上午11:12:00
//方法3：参数为毫秒数
var d3=new Date(5000)
console.log(d3.toLocaleString())//1970/1/1 上午8:00:05
console.log(d3.toUTCString())//Thu, 01 Jan 1970 00:00:05 GMT
//方法4：参数为年月日时分秒毫秒
var d4=new Date(2004,2,20,11,12,0,300)
console.log(d4.toLocaleString())//2004/3/20 上午11:12:00 毫秒并不直接显示
Date对象的方法：
var d=new Date()
| 方法名 | 功能 |
|---|---|
| getDate() | 获取日 |
| getDay() | 获取星期（0-6） |
| getMonth() | 获取月（0-11） |
| getFullYear() | 获取完整年份 |
| getYear() | 获取年(经过多少年) |
| getHours() | 获取小时 |
| getMinutes() | 获取分钟 |
| getSeconds() | 获取秒 |
| getMilliseconds() | 获取毫秒 |
| getTime() | 返回累计毫秒数（从1970/1/1午夜） |
json对象
var str1 = '{"name": "Alex", "age": 18}';
var obj1 = {"name": "Alex", "age": 18};
// JSON字符串转换成对象
var obj = JSON.parse(str1);
// 对象转换成JSON字符串
var str = JSON.stringify(obj1);
RegExp对象
// 定义正则表达式两种方式
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/;
// 正则校验数据
reg1.test('jason666')
reg2.test('jason666')
/*第一个注意事项，正则表达式中不能有空格*/
// 全局匹配
var s1 = 'egondsb dsb dsb';
s1.match(/s/)
s1.match(/s/g)
var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/g
reg2.test('egondsb');
reg2.test('egondsb');
reg2.lastIndex;
/*第二个注意事项，全局匹配时有一个lastIndex属性*/
// 校验时不传参数
var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/
reg2.test();
reg2.test(undefined);
var reg3 = /undefined/;
reg3.test();