1.认识js
1.1.js是javaScrip的缩写,是一门脚本语言。专门用来负责网页上的行为（可以直接写到网页中）。
1.2.在哪儿写js代码
a.可以写在script标签中（理论上script标签可以放在html中任何位置，实际开发的时候一般放在head或者body中）
b.写到标签的事件属性中（例如：onclick）
c.写到外部的js文件中（.js）
1.3.js在网页中能做什么事情
a.在网页的不同的位置插入html代码
b.修改某个标签的内容
c.修改标签的样式
奥法当哦
2.js基础语法
2.1.js中的注释
//这是单行注释
/*
这是js多行注释
*/
2.2.语句
一条语句结束需要加分号（现在的js版本也可以不用写）
一行写多条语句必须用分号隔开
2.3.js没有缩进问题，用{}表示一个块
//在控制台中打印括号中的内容，功能如print
console.log('hello js');
console.log('oh my gad');
function print(){
console.log('it is very funly')
}
2.4.基本数据类型
Number(数字)、String(字符串)、Boolean(布尔)、Array(数组)--列表、Object(对象)--字典、Function(函数)、null、undefined
2.5.字面量
//数字字面量
89;10.11;3e8;
//字符串字面量
'abc';"bcd";
//布尔字面量
true;false
//数组字面量
[55, 88, 'kkk', true];[];
//对象的字面量(对象的key值又是属性，不用加引号)
{a:'coan'};
var dict = {a:'afas', b:'adocn'}
console.log(dict.a, dict['b'])
2.6.标识符
//使用标识符来命名
//a.字母、数字、_和$组成，数字不能开头
var cao_$;
//b.不能是关键字
//var for
//c.大小写敏感，区分大小写
var For
//d.规范：1.见名知意；2.驼峰原则
3.变量的声明
3.1.在js中可以通过声明变量来保存数据
a.语法
var 变量名;
var 变量名 = 初值;
说明：var是关键字;
变量名：标识符,不能随意使用_或者$开头,驼峰式命名规则（第一个单词首字母小写，后面每个单词首字母大写）
//说明变量
var userName
//给变量赋值
userName = 'xxx'
console.log(userName)
var score = 100
console.log(score)
//同时说明多个变量
var name, age, sex;
name = 'abc';age = 18;
//一个变量可以存储任意类型的值，声明变量的时候，变量没有赋值，默认是undefined
var a = 100;
a = 'abc';
4.运算符
4.1.数学运算符：+，-，*，/，%，++，--
//a.和数学运算一致
var a = 10 + 20;
var b = 10 - 20;
var c = 10 * 20;
var d = 7 % 2;
//b / 和数学中的除一样
var e = 5/2;
console.log(e);
//c.++,--(单目运算符)
/*
* 语法：变量++/-- ++/--变量(注意：运算顺序是从左往右运算)
* ++：自加1
* --：自减1
*/
var f = 10;
f++;
console.log(f)
console.log(f++) // ++/--写到后面时，先赋值，再自加/自减
console.log(++f) // ++/--写到前面时，先自加/自减，再赋值
4.2.比较运算符：>, <, ==(相等), !=, >=, <=; ===(完全相等), !==, >==, <==
- 结果都是布尔值
console.log(10 > 20); // false
//==:判断值（内容）是否相等
console.log(5==5); // true
console.log(5=='5'); // true
//===:判断值和类型是否相等
console.log(5===5); // true
console.log(5==='5'); // false
console.log(5!=5, 5!='5'); //false, false
console.log(5!==5, 5!=='5'); //false, true
4.3.逻辑运算符：&& || ！（与 或 非）
console.log(true&&false);
4.4.赋值运算符：=， +=， -=， *=， /=, %=
//赋值运算符的左边必须是变量
var cc = 100;
cc += 10;
cc -= 10;
cc *= 10;
cc /= 10;
cc %= 10;
console.log(cc);
4.5.三目运算符：
- a.语法 条件语句 ？ 值1：值2
- b.结果 判断条件语句，true - 值1； false - 值2
var dd = 10 > 20 ? 100:200;
console.log(dd);
//求两个数之间的最大值
var a1 = 10;
var a2 = 20;
console.log(a1 > a2 ? a1:a2)
4.6.运算符的优先级,可以通过括号来改变
- 优先级从低到高：赋值运算符<逻辑运算符<比较运算符<算数运算符
- 算术运算中：先幂运算再乘除取余再加减
- 逻辑运算中：先与再或
如果不确定运算顺序，可以通过添加括号来改变运算顺序。
5.分之结构
js中的分之结构有两种：if语句，switch语句
5.1.if语句
- a.if(条件语句){条件语句为true时执行的代码块}
var age = 18;
if(age>=18){
console.log('成年');
};
- b.if(条件){代码块1}else{代码块2}
if(age>=19){
console.log('成年');
}else{
console.log('未成年');
}
- c.if- else if - else
if(age<=12){
console.log('童年');
}else if(age>=18){
console.log('老年');
}else{
console.log('少年');
}
5.2.switch语句
- a.结构
switch(变量) {
case 值1:代码块1；break；
case 值2:代码块2；break;
...
default:代码块3； break；
} - b.执行过程：使用变量的值依次和后面的每个case的值进行判断，看是否完全相等（===）
如果完全相等就执行case后面的语句，直到遇到break。
如果没有匹配的就执行default后面的语句。
var score = 10;
switch (score){
case 1:
console.log('F');
break;
case 4:
console.log('D');
break;
case 10:
console.log('A+');
break;
default:
console.log('其它');
break;
}
console.log('==========');
6.循环结构
js中的循环分为for循环和while循环
6.1.for循环
- a.for - in（和python中的for循环一样）
for(变量 in 字符串/数组/对象){循环体}
var arr1= [1, 2, 'abc']
//x 取的是下标
for (var x in arr1){
console.log(arr1[x])
}
var obj1 = {name:'xxx', age:18}
// x 拿到的是属性名
for(var x in obj1){
console.log(x, obj1[x])
- b.for(表达式1；表达式2；表达式3){循环体}
执行过程：执行表达式1，然后判断表达式2，如果为true，执行循环体，执行表达式3； 继续判断表达式2；如果为true，再执行循环体，然后执行表达式3；直到表达式2为false，循环结束。
//计算1-100的和
var i = 1;
var sum = 0;
for(i; i<=100;i++){
sum += i;
}
console.log(sum);
6.2.while循环
- a.while(条件语句){循环体}
过程：先判断条件语句，如果为true，执行循环体，循环体执行完以后，再判断条件语句；直到条件语句为false，循环结束。
var i = 1;
var sum = 0;
while(i<101){
sum += i;
i++;
}
console.log(sum);
- b.do-while循环:do{循环体}while(条件语句)；
执行过程：先执行循环体，然后判断条件是否成立,如果成立再执行循环体。直到条件不成立，循环结束。
var i = 1;
var sum = 0;
do{
sum += i;
i++;
}while(i<101);
console.log(sum);
6.3.break和continue
- break和continue两个关键字，都是作业与循环，用来结束循环的。
- continue：在循环体中遇到continue，就结束本次循环，直接进入下次循环判断。
var i = 0;
while(i<10){
if(i>5){
continue;
}
console.log(i);
}
- break:在循环中遇到break，就直接结束整个循环，直接执行循环后边的其它语句。
注意：break结束的是距离它本身最近的那个循环。
for(var i = 0;i<10;i++){
console.log(i);
break;
}
7.函数
7.1.函数的声明
- function 函数名（参数列表）{函数体}
a.function - 关键字
b.函数名 - 标识符：驼峰式：见名知义
c.参数（个数必须确定）：形参可以有默认值（带默认值的参数放到最后）。调用函数传参的时候是按实参的位置传参。保证每个参数都有值
d.函数体：实现函数的功能。只有再调用的时候才执行
function sum1(num1, num2){
console.log('求两个数的和');
return num1 + num2;
}
console.log(sum1(5, 11));
console.log(sum1(4));
函数没有return或者return后面没有内容的时候，函数的返回值是undefined
function fun1(){
return;
console.log('hhhhh');
}
console.log(fun1());
7.2.函数的调用
函数名（实参列表）
- 调用过程：
a.回到函数声明的地方
b.将实参传递给形参
c.执行函数体
d.将返回值返回给函数的调用者
e.回到函数调用的位置
7.3.作用域
- 全局变量：声明在函数外面的变量（从变量声明到文件结束）
- 局部变量：声明在函数里面的变量（从变量声明到函数结束, 函数的形参也是局部变量）
//全局变量
var aaa = 10;
function func2(){
//局部变量
var bbb = 100;
console.log(aaa);
console.log(bbb);
//函数中可以修改全局变量的值
aaa = 200;
//函数中可以声明函数
function func22(){
bbb = 1.1;
console.log(bbb);
}
}
func2()
console.log(aaa);
//可以将函数作为变量
console.log('============')
var a = func2;
a();
8.数据类型
数字、字符串、布尔、数组（列表）、对象
8.1.数字：包含整数和小数(支持科学计数法)
var num1 = 10;
var num2 = new Number();
console.log(num2+1);
8.2.字符串
//a.''和""括起来的字符串
//b.转义字符（和python一样,没有阻止转义（r/R））
//c.字符编码是unicode编码
var str1 = 'abc';
var str2 = "bcd";
var str3 = '\n';
var str4 = '\\';
console.log(str4);
//e.获取字符串长度：字符串。length
console.log(str1.length);
//f.获取单个字符：字符串[下标]
//下标：1.范围是0~长度-1 2.如果越界，不报错，但是结果是undefined
//js中的字符串不能切片
console.log(str1[0]);
//g.运算符
//js中字符串只支持+,不支持*
//字符串1 + 字符串2 -- 拼接字符串
//js中字符串可以和其它任何数据进行加操作，其效果都是字符串连接（会将其它数据类型转换成字符串）
console.log('123' + 'abc', 'abc' + 100);
//h.字符串相关方法（查）
8.3.对象，构造方法（相当于 - 类）
var obj1 = {name:'xxx', age:18};
console.log(obj1.name, obj1['name']);
//声明构造方法
function Person(name='', age=0, sex='男'){
this.name = name;
this.age = age;
this.sex = sex;
}
var p1 = new Person('abc', 18);
p1.name = 'xxx';
console.log(p1, typeof(p1))