day5 js基础语法

1.js基础语法

1.1.控制台输出 和print功能一样

console.log(100)
console.log('lorry',200,20)

1.2 注释

//单行注释
/*
*多行注释
*多行注释
*/

1.3标识符：

由字母数字下画面和12s = 30
//12a = 30 数字不能开头
// as^ = 200

1.4：行和缩进

从语法角度，js代码怎么换行和缩进都无所谓。js中通过{}确定一个代码块

1.5：常见的数据类型：数字，布尔，字符串，数组，对象，函数

• a：数字：（Number） - 包含所有的数字，包括整数和小数；例如100,12.5，-200,3e2，不支持虚数
• b.布尔（Boolean） - 只有两个值true和false，这两个是关键字，分别代表真和假
• c.字符串，string - 使用单引号或者双引号引起来的字符集
• d.列表（Array） - 相当于Python中的列表，[12,'abc',true]
• e;对象（Object） - 相当于Python中的字典和对象{属性：值}
• f:函数（Function） - 相当于Python中的函数

    console.log(3e2,"lorry",'lorrybz',[12,'abc',true])
    obj1 = {name:'小明',age:10}
    console.log(obj1['name'],obj1.name)

1.5:声明函数

    function eat(food){
        console.log("吃"+food)
    }
    eat('面条')

2.变量的声明

• 语法1.变量名 = 值
  变量名 - 标识符，不能是关键字；驼峰式命名（第一个单词首字母小写，后边每个单词首字母大写），见名知意
  变量要先声明才能使用

• 语法2：var 变量名 = 值 或者直接不赋值.
  var - 声明变量的关键字
  区别：添加var的时候，变量可以不用赋值，默认是undefined，不加var就必须赋值
  补充：js中两个特殊的值 - undefined（没有，空）和null（清空）

name = '小明'
    console.log(name)
    arr1 = [1,34,45]
    console.log(arr1[10])
    var age = 10
    var sex   //通过var声明变量不赋值的时候，默认是undefined
    console.log(age,sex)
    //重新赋值
    name = '小明'
    age = 25
    sex = '男'
    console.log(name,age,sex)

同时声明多个变量赋不同的值以及相同的值

    //同时声明多个变量，赋一样的值
    a1 = a2 = a3 = 10
    console.log(a1,a2,a3)
    //同事声明多个变量，赋不同的值
    var b1 = 1,b2 = 2,b3 = 3,b4
    b1 = 1,b2 = 2,b3 = 3
    console.log(b1,b2,b3,b4)

3.运算符

1.数学运算符：+ - * / ++ --

前面四个运算符和Python一模一样，
++ -- 都是单目运算符，只能对一个值进行操作
使用方式：变量++/--，++/--变量
a.++ - 自加1运算；让变量本身的值加1
b.自减1运算：让变量本身的值减1

   num = 10
    num++
    console.log(num) //11
    ++num
    console.log(num)  //12
    num--
    console.log(num)  //11
    --num
    console.log(num)  //10

注意：用一个变量使用单独使用++、--的时候，++/--放前面放后面效果一样
如果使用++/--的结果给另外一个变量赋值的，++/--放前面，先自加再赋值，放后面先赋值再运算

    num2 = 10
    num = (++num2)   //相当于：num2 += 1；num = num2
    console.log(num,num2)

    num2 = 10
    num = num2++    //相当于：num = num2;num2 += 1
    console.log(num,num2)

2.比较运算符

,< ==,!=,>=,<= === !==
结果是布尔值
比较大小和Python一样
a.==判断值是否相等
b.===判断值和类型是否相等（完全相等），相当于Python中==，！==相当于Python中的不等

    console.log(5 == 5) // true
    console.log(5 == '5') //true
    console.log(5 != 5) // flase
    console.log(5 != '5') //flase
    
    console.log(5 === 5) // true
    console.log(5 === '5') //flase
    console.log(5 !== 5) // flase
    console.log(5 !== '5') //true

3逻辑运算符：

&&（与） ||（或） ！（非）
运算规则和使用方式和Python的一模一样

    console.log(true && true)
    console.log(true && false)
    console.log(true || false)
    console.log(false || false)
    console.log(!true)
    console.log(!false)

4.赋值运算符

+=，-=，*=，/=，%=

5.三目运算符

条件语句？ 值1：值2 - 判断条件语句的值是否为true，为true整个表达式的结果就是值1，否则就是值2

    age = 16
    is_man = age >= 18? '成年' : '未成年'
    console.log(is_man)

6.运算符

数学 》 比较》逻辑》赋值:如果有括号，先算括号里面的

4.分支结构

1.if分之

1.if语句
     * a.if
     * if（条件语句）{
     *      满足条件会执行的代码
     * }
     * 
 b.if - else
     * if（条件语句）{
     *      代码段1
     * }
     * else{
     *  代码段2
     * }
     * 
 c.if else if -else
     * if（条件语句）{
     *  代码段1
     * }
     * else if（条件语句2）{
     *  代码段2
     * }
     * else（代码段n）{
     *  代码段n
     * }
     * 执行过程和Python一模一样

num = 10
    if(num % 2){
        console.log('奇数')
    }else{
        console.log('偶数')
    }
    age = 20
    if(age < 18){
        console.log("未成年")
    }else if(age < 60){
        console.log('成年')
    }else{
        console.log('老年')
    }

2.switvh语句

1.结构
switch（表达式）{
case 值1：
代码段1
case 值2：
代码段2
。。。。。
default：
代码段
}
2.执行过程
使用用表达式的值依次和后面每个case后面的值进行比较，看是否相等，找到第一个和表达式相等的case，将case作为入口，依次执行后面的代码段直到，执行完成，或者遇到break为止
如果每个case的值和表达式的值都不想等，就执行default后面的代码
注意：case后面必须是一个有结果的表达式

/练习：用一个变量保存十分制的成绩，根据成绩打印情况：

0-5：代表不及格
6,及格
7，8良好
9,10优秀，

    score = 9
    switch(score){
        case 1:
        case 2:
        case 3:
        case 4:
        case 5:
            console.log('不及格')
            break
        case 6:
            console.log('及格')
            break
        case 7:
        case 8:
            console.log('良好')
            break
        default:
            console.log('优秀')
    }

3.循环结构

1.for循环

a.for in
for （变量 in 序列）{
循环体
}
执行过程和python是一样的，但是变量取到的不是元素，而是下标key（属性名
序列 - 字符串，数组，对象

    for(x in "abc"){
        console.log('=====')
        console.log(x)
    }
    arr1 = [1,'abc',true,12.5]
    for(index in arr1){
        console.log(index,arr1[index])
    }
    person1 = {name:"小明",age:'18',sex:'男'}
    //typeof拿到的是类型
    for(x in person1){
        console.log('啦啦啦啦',x,typeof(x))
        console.log(person1[x])
    }

补充：c语言的循环

• 结构：
  for（表达式1；表达式2；表达式3）{
  循环体
  }
  执行过程：先执行表达式1，判断表达式2的值是否为true，如果为true就执行循环体，执行完循环体就执行循环体3
• 然后再判断表达式2是否为True,如果为true就执行循环体，执行完循环体再执行表达式
  ....一次类推，知道表达式2的结果为false为止（循环结束）
  表达式1
  while 表达式2
  循环体
  表达式3

num = 1
    sum1 = 0
    while(num <= 100){
        sum1 += num
        num += 1
    }
    console.log(sum1)
        
    for(num = 1,sum1 = 0;num <= 100;num++){
        sum1 += num
    }
    console.log(sum1)

2.while循环

a.Python中的while循环
while（条件语句）{
循环体
}
执行过程和Python一模一样
do while循环
do{
循环体
}while条件语句
区别：do while的循环体至少执行一次

    num = 0
    sum2 = 0
    do{
        sum2 += num
        num ++
    }while(num <= 100)
    console.log(sum2)

4.函数的声明

结构1.函数的声明
function 函数名（参数列表）{
函数体
}
** js中的函数除了声明的关键字不一样，其他的都一样**

    //参数可以设置默认值
    function sum(num1,num2 = 3){
        console.log("求两个数的和")
        return num1+num2
    }
    //2.函数的调用(实参列表)
    console.log(sum(10,20))
    console.log(sum(10))
    console.log(sum(num1 = 10,num2 = 20))
    
    //js中所有的函数都有返回值，默认值是undefined
    function func1(){
        console.log('func1')
    }
    re = func1()
    console.log(re,typeof(re))

结构2：.匿名函数（函数的字面量）
函数名 = lambda 参数列表：返回值
函数名 = function（参数列表）{函数体}

func2 = function(a,b){
        console.log(a,b)
        return a*b
    }
    console.log(func2(3,4)) 
    
    funcs_arr = [func1,function(a){console.log(a)}]
    funcs_arr[0]()
    funcs_arr[1]("abc")

6.变量的作用域：

js中的作用域

a.全局变量：只要申明在函数外边就是全局变量，在函数中以变量名 = 值的形式声明的变量
也是全局的。
b.局部变量：声明在函数中，并且以var关键字声明在函数中变量才是局部变量

    var1 = 1000 //这是一个全局变量
    var var2 = "abc"//这是一个全局变量
    for(xxx in "hello"){
    }
    var3 = 1 
    
    func3 = function(){
        console.log('func3')
        a1 = 20  //这是一个全局变量
        b1 = 20  //这是一个全局变量
        var4 = 4  //这是一个全局变量
        var var3 = 1   //这是一个局部变量
        return var1 +var2
    }
    console.log(func3())
    console.log(a1+var4)    

7.字符串

1.字符串的字面量

a.使用双引号或者单引号括起来的字符集
b.字符可以是转义字符 \r,\t,\n,\,',"
c.\u四位的十六进制值对应的Unicode编码，如：\u4e00

str1 = 'abc\n123'
    console.log(str1)
    str2 = "abc\"123\u4e00"
    console.log(str2)

2.获取字符串

字符串[下标] - 获取单个字符*
下标 - 范围是0-（长度-1）：下标越界，取到的值是undefined
s中没有切片的方法

str1 = 'hello'
    console.log(str1[1])

3.相关运算

NaN ,js中的一个特殊的值，类似于undefined，null，用来表示一个不存在的数值。
字符串+数据：支持字符串和其他任何数据相加，是将其他数据全部转换成字符串，然后再拼接。
支持加法运算

4.字符串长度`

console.log('hello world'.length)
    
    
    str3 = 'abc' //str是字符串尅性
    str4 = new String(str3)
    console.log(str3 == str4,str3 === str4)
    console.log(str3[1],str4[1])
    
    //protype:给指定类型的对象添加属性和方法
    String.prototype = "lorry"
    console.log("abc".lorry)

5.字符串的相关方法

    function lorry_print(aa){
        console.log(aa)
    }
    lorry_print("abc".charAt(2))
    lorry_print(String.fromCharCode(97))
    lorry_print('abcd12abc23hhhh123'.match(/\d+/g))
    result = 'abcd12abc23hhhh123'.match(/\d+/)
    for(index in result){
        lorry_print(index)
    }
    lorry_print('abcd12abc23hhhh123'.replace(/\d+/g,'*'))
    
    //js中的数组只是需要关注a.怎样获取数组减的元素，b.数组对应的方法，c.元素可以是任何类型
    arr = [1,'abc',true]
    lorry_print(arr)
    
    nums = [1,34,67,2]
    nums2=nums.sort()
    lorry_print(nums)
    lorry_print(nums2)