day20

day20

一 选择器的优先级

权重值越大优先级越高。（无论权重是多少，内联样式表的优先级是最高的）

1. 元素选择器、* 权重值是：1
2. 类选择器的权重值是：2
3. id选择器的权重值是：4
4. 群组选择器：看每个独立选择器的权重值分别是多少
5. 后代选择器和子代选择器：所有被>或者空格隔开的选择器的权重之和
6. 后代选择器比较权重的时候，先比较比较第一大的独立选择器的权重，谁的权重大谁的优先级就高，如果第一大相同，就比较第二大的，以此类推。

二 认识js

2.1.什么是js

js是JavaScript的缩写，是一门专门用来控制前端页面的编程语言（属于脚本语言）
js是web中的行为标准 - 主要负责网页中内容的修改

2.2.js代码写到哪儿

①内联js - 将js代码写在标签的时间属性中

<button type="button" onclick="alert('你好阿菜!')">按钮1</button>

②内部js - 将js代码写在script标签中

<script type="text/javascript">// js代码alert('这是内部js')
</script> 

③外部js - 将js代码写在js文件中，用script标签导入

<script src="js/02-认识js.js" type="text/javascript" charset="utf-8"></script>

注意：同一个script标签只能在导入外部js和内部js两个功能中选一个

2.3.js能干什么

①修改/获取标签内容
②修改/获取标签属性
③修改标签样式
④在网页中插入html代码

2.4.js怎么写（语法）

大小写敏感
一行语句结束一般不需要分号，箭头函数之前需要加分号
命名采用驼峰式命名
js中的标识符：由字母、数字、下划线和$组成，数字不能开头

三 变量

3.1 定义变量

语法：
变量 = 值
var 变量名 = 值
let 变量名 = 值
const 变量名 = 值

1. 四种定义变量的方法

StudentName = '阿康'
console.log(StudentName)var age = 18
console.log(age)let sex = '男'
console.log(sex)const height = 180
console.log(height)

2. 四种方法的区别
   a.前三种方式定义的变量，变量的值可以修改；用const定义的变量的值不可以修改
   b.不同的作用域
   ①变量名 = 值 - 这儿的变量是全局变量(不管在哪儿定义都是全局变量)
   ②var 变量名 = 值 - 在函数中定义是局部变量，没有定义在函数中就是全局变量
   ③let 变量名 = 值 - 在{}中定义的是局部变量，没有定义在{}中的是全局的。

num = 100var x = 'hello'let a = 11{num2 = 200var x2 = 'are'let a2 = 22}function func1(){num3 = 300}

3.2 同时定义多个变量

变量名1=变量名2=变量名3=…=值

var a1,b1,c1=20
console.log(c1)

四 运算符

4.1 数学运算符：+、-、*、/、%、++（自增1）、–（自减1）

++/–放在前面后面和时候的不同

num = 10
num2 = ++ num    //num2 = 11num = 10
num2 = num ++    //num2 = 10

4.2 比较运算符：>、<、>=、<=、、!=、=、!==

结果都是布尔

console.log(10>20)      //false
console.log(5 == '5')   //true
console.log(5 == 5 )     //true
console.log(5 === '5')  //false
console.log(5 === 5 )   //true

注意：js中的比较运算符，不支持连写表示范围

age = 30
console.log(18<=age<=28)   //true

4.3 逻辑运算符：&&（逻辑与运算）、||（逻辑或运算）、!（逻辑非运算）

4.4 赋值运算符：=、+=、-=、*=、/=、%=

五 分支结构

5.1 if分支结构

语法：
if(条件语句){
代码块
}

if(条件语句){
条件满足执行的代码
}
else{
条件不满足需要执行的代码块
}

if(条件语句1){
代码块1
}else if()条件语句2{
代码块2
}else if(条件语句3){
代码块3
}
…
else{
代码块N
}

age = 19
if(age>=18){console.log('成年')
}else if(age<=0 || age>=150){console.log('你是魔鬼')
}else{console.log('未成年')
}

5.2 switch

语法：
switch(表达式){
case 值1:{
表达式1
}
case 值2:{
表达式2
}
…
defalt:{
表达式N
}
}

说明：

1. switch和case、defualt是关键字
2. case语句后面的{}可以省略
3. 表达式可以是任何有结果的表达式
4. 值也必须时有结果的表达式，通常直接写一个固定的数据。

执行过程：
先计算表达式的值，然后让表达式的值依次和每个case后面的值进行比较，哪个case后面的值和表达式的值相等，就将这个case作为入口，依次执行这个case以及它后面的代码块，直接执行完或者遇到break就结束。如果没有哪个case后面的值和表达式的值相等，就将defalt作为入口（注意：defualt不是一定要放到最后）

switch(10){default:{console.log('表达式6')}case 0:{console.log('表达式1')}case 1:{console.log('表达式2')}case 2:{console.log('表达式3')}case 3:{console.log('表达式4')}case 4:{console.log('表达式5')}}

5.3 三目运算符

表达式?值1:值2 - 判断表达式的值是否为true，如果是true，整个表达式的结果是值1，否则是值2。

六 循环结构

6.1 while循环

①while
while(条件语句){
循环体
}

②do-while（保证循环至少执行一次）
do{
循环体
}while(条件语句)

6.2 for循环

①for-in
for(变量 in 序列){
循环体
}

说明：
a.序列是字符串或者数组，变量取的是下标
b.序列是对象，变量qu的是属性名（相当于字典的key）

②标准for
for(表达式1;表达式2;表达式3){
循环体
}
执行过程：先执行表达式1，然后判断表达式2的结果是否为true，如果为true就执行循环体，执行完循环体就执行表达式3，再判断表达式2是否为true，为true就执行循环体，执行完循环体就执行表达式3…以此类推，直到表达式2的结果为false，整个循环结束。

names = ['张三','李四','阿康']
for(x in names){console.log('x',x,names[x])
}

七 函数

7.1 函数的定义

function 函数命(参数列表){
函数体
}

注意：js中每个函数中都有一个变量arguments，用来接收这个函数在调用的时候传的所有的实参。

function sum(num1,num2){return num1+num2
}function func1(a=90,b,c=20){console.log(`a:${a} b:${b} c:${c}`)
}

7.2 函数的调用

函数命(实参列表)

console.log(sum(1,2))
func1(40)

有默认值的参数可以放在没有默认值的前面。
注意：js中使用关键字传参无效，只能使用位置参数传参。
调用函数如果不给没有默认值的参数传参，不会报错，这个参数的值会是undefined

7.3 arguments

js中每个函数中都有一个变量arguments，用来接收这个函数在调用的时候传的所有的实参。

function func3(){console.log(arguments)
}func3()
func3(10)
func3(10,20)
func3('name','age',20)
console.log('===========================')
function func4(x){console.log('x',x)console.log(arguments)for(i in arguments){console.log('i',i,arguments[i])}
}
func4()
func4(100,200)
func4('name','阿康','age',18)

7.4 匿名函数

函数命 = function (参数列表){
函数体
}

sum1 = function (x,y){console.log(x+y)return x+y
}
sum1(10,20)

7.5 箭头函数

语法:
(参数列表)=>{函数体}

sum2 = (x,y)=>{console.log(`x+y:${x+y}`)return x+y
}
sum2(100,200)