############### JS简介和JS引入 ################
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--
js简介
英文：javascript
这是一门编程语言，
要学习什么？
1，js的核心语法：
1，基础语法
2，数据类型
3，函数
4，面向对象(ES6)
2，BOM：这是操作浏览器的，比如浏览器弹窗
3，DOM：这是操作浏览器上面html内容的，
就是这三部分
js是一个解释性语言，是需要一个解释器的，但是解释器比较特殊，只要有浏览器就可以解释js，
-->
<!--
如何引入js文件
-->
<!--第一种方式，通过script标签-->
<!--<script>-->
<!--alert(121212)-->
<!--</script>-->
<!--第二种方式，写一个js文件，-->
<script src="1.js"></script>
<div id="d1">sss</div>
</body>
</html>
############### JS的基本语法和数据类型（数字和字符串） ################
/*
js基础语法：
1，注释：
单行注释：//
多行注释：
####################
2，语句必须以分号结尾
3，变量生命的关键字：var 变量名 = "值"
js是属于动态类型，就是同一个变量可以存储不同类型的值，类似python，
4，变量
变量命名的规则，js中$也可以作为变量名，
1，变量区分大小写
2，推荐使用驼峰命名法
3，保留字不能用作变量名
*/
//变量声明
var name = "小明";
var age = 10;
var $ = "女";
console.log("name",name);
console.log("age",age);
console.log("$",$);
/*
5，数据类型：
整数，浮点数，科学计数法
还有一种NaN，表示不是一个数字，not a number
* */
//数字类型
var n1 = 18;
var n2 = 18.1;
var n3 = 1.8e5;
//字符串类型
var s1 = "123";
var s2 = "234";
var s3 = s1+s2; // 字符串拼接
console.log(s3)
/*
字符串常用方法：
.length 返回长度
.trim() 移除空白
.trimLeft() 移除左边的空白
.trimRight() 移除右边的空白
.charAt(n) 返回第n个字符
.concat(value, ...) 拼接，eg: concat(1) 在后面拼接1，concat(1,2,3) 在后面拼接1,2,3
.indexOf(substring, start) 子序列位置，返回的是子字符串的起始位置，
.toLowerCase() 小写
.toUpperCase() 大写
.split(delimiter, limit) 分割，第一个参数是根据什么分割，第二个参数是限制分割多少个，第二个参数可以不写
#########################
.substring(from, to) 根据索引获取子序列
.slice(start, end) 切片
//substring和slice有什么相同之处：
两者的相同点：
如果start等于end，返回空字符串
如果stop参数省略，则取到字符串末
如果某个参数超过string的长度，这个参数会被替换为string的长度
substirng()的特点：
如果 start > stop ，start和stop将被交换
如果参数是负数或者不是数字，将会被0替换
silce()的特点：
如果 start > stop 不会交换两者
如果start小于0，则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0，则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)
* */
############### JS数据类型（布尔和数组类型） ################
/*
布尔类型
区别于Python，true和false都是小写。
""(空字符串)、0、null、undefined、NaN都是false。
* */
//布尔类型
var a = true;
var b = false;
//数组类型
// 类似python中的列表
var a1 = [1,2,3]
a1[0] //返回1，
a1[3] //返回undefined
// a1[1:2] //不支持这种冒号的
/*
.length 数组的大小
.push(ele) 尾部追加元素
.pop() 获取尾部的元素，和python一样，会从列表取出，并且返回
.unshift(ele) 头部插入元素
.shift() 头部移除元素
.slice(start, end) 切片
.reverse() 反转
.sort() 排序 这个排序比较鸡肋，要转换成字符串，然后排序，
#############################
.join(seq) 将数组元素连接成字符串，
python中
l1=["1","2","3"]
("+").join(l1)
这是把列表中的元素，使用加号连接，返回是一个字符串
js中
l1=[1,2,3]
l1.join("+") //返回1+2+3
#########################
.concat(val, ...) 连接数组，
l1=[1,2,3]
l1.concat(1,2,3) //结果：[1,2,3,1,2,3]
l1.concat([1,2,3]) //结果：[1,2,3,1,2,3]
###########################
null表示值是空，一般在需要指定或清空一个变量时才会使用，如 name=null;
undefined表示当声明一个变量但未初始化时，该变量的默认值是undefined。还有就是函数无明确的返回值时，返回的也是undefined。
null表示变量的值是空，undefined则表示只声明了变量，但还没有赋值。
############################
var a1 =[12,2]
typeof a1 //这是查看数据的类型，记住数组和null，返回的是object类型
typeof是一个一元运算符（就像++，--，！，- 等一元运算符），不是一个函数，也不是一个语句。
typeof "abc" // "string"
typeof null // "object"
typeof true // "boolean"
typeof 123 // "number"
* */
############### JS运算符 ################
/* 算数运算符： + - * / % ++ -- var n =10; n++ //11，就是n=n+1 ################################ 比较运算符 > >= < <= != == === !== 注意： 1 == “1” // true 这是弱等于，只判断值 1 === "1" // false 这是强等于，既判断值也判断类型 ################################ 逻辑运算符 && 与 || 或 ! 非 ################################ 赋值运算符 = += //n+=1 就是 n= n+1 -= *= /= * */
############### JS流程控制语句 ################
// for循环
// a1 = [1,2,3]
// for (var i =0;i<a1.length;i++){
// console.log(a1[i])
// }
//while 循环
// var i = 0;
// while (i < 10) {
// console.log(i);
// i++;
// }
// 三元运算
var a = 1;
var b = 2;
var c = a > b ? a : b;
//? 号前面是条件，成立就是第一个a，不成立就是第二个b
############### JS函数 ################
//js中函数和python中的函数非常的相似，只是定义的方式有些不同
//函数的定义
function foo(a,b) {
console.log(a);
console.log(b);
return a+b; //带返回值的函数
}
//匿名函数
//需要使用一个变量去接收他，
var func = function (a,b) {
console.log(a);
console.log(b);
return a+b; //带返回值的函数
};
//立即执行函数
//先写两个括号，第一个括号内部定义，第二个括号内部传递具体的参数
(function (a,b) {
console.log("立即执行函数");
console.log(a+b)
})(11,222);
//arguments
function foo(a,b) {
console.log(a);
console.log(b);
console.log(arguments.length);
//这个 arguments 根据传入的参数，是一个列表[a,b]
//可以遍历这个arguments对象
return a+b; //带返回值的函数
}
//函数的调用
var ret1 = foo(11,22);
// 调用的时候，如果传递的超出定义的，超出的不起作用，并不会导致程序报错，
//如果传递的参数少于定义的，未定义的就会显示undefined，也不会程序报错，
//这是js比较随便的地方，
console.log(ret1);
var ret2 = func(11,12);
console.log(ret2);
/*
局部变量：
在JavaScript函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它（该变量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除。
全局变量：
在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
变量生存周期：
JavaScript变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除
* */
############### JS词法分析 ################
//js的词法分析
var age =18;
function foo() {
console.log(age);
var age =22;
console.log(age);
}
foo(); //结果是 undefined ，22 ，
//为什么？
//因为函数执行的时候，会对函数内部进行词法分析
/*
JavaScript中在调用函数的那一瞬间，会先进行词法分析。
词法分析的过程：
当函数调用的前一瞬间，会先形成一个激活对象：Avtive Object（AO），并会分析以下3个方面：
1:函数参数，如果有，则将此参数赋值给AO，且值为undefined。如果没有，则不做任何操作。
2:函数局部变量，如果AO上有同名的值，则不做任何操作。如果没有，则将此变量赋值给AO，并且值为undefined。
3:函数声明，如果AO上有，则会将AO上的对象覆盖。如果没有，则不做任何操作。
函数内部无论是使用参数还是使用局部变量都到AO上找。
* */
############### JS内置对象-自定义对象 ################
/*
js中内置的对象和方法：
* */
//js中自定义对象
var person = {name:"andy",age:18};//在js对象中，属性名默认不需要加引号，你加了js也会给你去掉的，值可以是单引号和双引号，单引号会转换成双引号
console.log(person);
// 单个取属性
console.log(person.name);
console.log(person.age);
//遍历取属性
for (var i in person){
console.log(i);
console.log(person[i])
}
//自定义对象的第二种方式：
var person2 = new Object();
person2.name="xiaoxiao";
person2.age=22;
console.log(person2);
############### JS内置对象-Date对象 ################
//内置的Date对象，就相当于python中的模块
var d1 = new Date();
console.log(d1); //这是默认生成当前时间，这是一个时间对象，
console.log(d1.toLocaleString()); //这是一个字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
/*
var d = new Date();
//getDate() 获取日
//getDay () 获取星期
//getMonth () 获取月（0-11）
//getFullYear () 获取完整年份
//getHours () 获取小时
//getMinutes () 获取分钟
//getSeconds () 获取秒
//getMilliseconds () 获取毫秒
//getTime () 返回累计毫秒数(从1970/1/1午夜)
* */
############### JS内置对象-json对象 ################
//json对象
var s = '{"name":"andy","age":12}'; //这是一个字符串，怎么使用js转换成为json格式的，
var ret = JSON.parse(s);
console.log(ret);
console.log(typeof ret); //类型是一个对象
// 怎么把js中的对象，转换成字符串呢？
var s2 = JSON.stringify(ret);
console.log(s2);
console.log(typeof s2); //类型是一个字符串
// 这两个一定要学会，后面使用ajax传递数据的时候，会使用到
############### JS内置对象-Math对象 ################
//math对象 var n = -5; n2 = Math.abs(n); //绝对值 console.log(n2); Math.floor(5.9); //直接往下去，这就是5， Math.min(1,2); Math.max(1,2); Math.pow(10,2); //返回x的y次幂 Math.random(); //返回一个0-1之间的随机数 Math.round(5.5); //四舍五入
############### JS内置模块-RegExp模块，正则模块 ################
//RegExp对象，正则，类似python中的re模块
//生成RegExp对象，
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");
//这是以字母开头，5-11位的字母数字下滑线组成
var reg2 = reg1.test('xiaoming');
console.log(reg2); //true
var reg3 = reg1.test('2xiaoming');
console.log(reg3); //false
//简单写法
console.log(/^[a-zA-Z][a-zA-Z0-9_]{5,11}$/.test("xiaoming"));
console.log(/^[a-zA-Z][a-zA-Z0-9_]{5,11}$/.test("3xiaoming"));
//这里面有很多的坑
// 1，re表达式内部不能加空格，否则会产生意想不到的错误，
// console.log(/^[a-zA-Z][a-zA-Z0-9_]{5, 11}$/.test("xiaoming"));
//2，test里面不写值，默认不是空，是校验的一个undefined，这是大坑啊，
console.log(/^[a-zA-Z][a-zA-Z0-9_]{5,11}$/.test());//等同于console.log(/^[a-zA-Z][a-zA-Z0-9_]{5,11}$/.test("undefined"));
//3，字符串替换
//两种模式，g，i，
var ss = 'Ahahaha';
var sss = ss.replace("a","哈");//这样写只会替换第一个a，这个要记住，
var sss = ss.replace(/a/,"哈");//这样写只会替换第一个a，这个要记住，这是正则的写法
var sss = ss.replace(/a/g,"哈");//加一个g，就是说全局有多少就替换多少，
var sss = ss.replace(/a/gi,"哈");//加一个i，就是说忽略大小写，都替换
console.log(sss);
############### 结束线 ################
来源：https://www.cnblogs.com/andy0816/p/12119003.html