20220706_JavaScript语法_变量定义_运算符_流程控制_函数定义

最新推荐文章于 2024-05-20 15:17:08 发布

PeterWarne

最新推荐文章于 2024-05-20 15:17:08 发布

阅读量57

点赞数

分类专栏： JavaWeb 文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/clarkgable/article/details/125631314

版权

JavaWeb 专栏收录该内容

32 篇文章 1 订阅

订阅专栏

变量var, let, const

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Gram of JS</title>
</head>
<body>
  <script>
    //变量var可以更新为不同类型的数据
    // var test = 20
    // test = 'change to string'
    // alert(test)

    //var的作用域是全局，新定义的同名var会覆盖旧的，不会报错
    {
      var age = 30
      var age = 33
    }
    document.write(age+'\<br/>')

    //let的作用域仅限代码块内
    // {
    //   let age1 = 100
    //   let age2 = 200
    //   document.write(age1)
    // }
    // document.write(age2)

    //const是只读常量，不可改变值
    // const ct = 99.88
    // ct = 100

    //用typeof方法获取变量类型
    document.write(typeof age +'\<br/>')
    var price = 99.99
    document.write(typeof price +'\<br/>')

    var cha = 'a'
    var name = 'zhang'
    var city = "HongKong"
    document.write(typeof cha +'\<br/>')
    document.write(typeof name +'\<br/>')
    document.write(typeof city +'\<br/>')

    var flag = true
    document.write(typeof flag +'\<br/>')

    //null属于原始值的一种，应该是原始类型，但被当作对象的占位符，跟引用类型一样被看作一个object类型，这是一个沿用下来的错误
    var obj = null
    document.write(typeof obj +'\<br/>')

    //没定义的，不知道值类型的var，类型为undefined
    var und
    document.write(typeof und +'\<br/>')
    
  </script>
</body>
</html>

运算符，需要注意的与java有别的事双等于号，全等于号，类型控制

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Operators in JS</title>
</head>
<body>
    <script>
        //双等于号会判断类型是否一样，不一样会转换再比较值
        var age1 = 20
        var age2 = '20'
        var age3 = 20
        // document.write(age1 == age2)//true
        // document.write("<br>")

        //全等于，如果类型不一样直接false，类型一样再比较
        // document.write(age1 === age2)//false
        // document.write(age1 === age3)

        /*类型转换，其他类型转换为number类型
        * String:按字符串字面值转换，方法为parseInt，若字面非数字，转成NaN
        * boolean: true转为1，false转为0*/

        var str = +"202" //用上运算符+,已经表示这个字符串要转化成数字了
        var str1 = "101"
        document.write(str + 20 +"<br>")//输出看到222，表示它事一个数字了
        document.write(str1 + 10 +"<br>")
        document.write(parseInt(str1)+10 +"<br>")

        var flag1 = +false
        document.write(flag1 + "<br>")//输出0

        /*类型转换，其他类型转boolean
        * number: 0和NaN转false，其他数字转true
        * String:空字符串为false，其他为true
        * null:转false
        * undefined:转false
        * 转boolean的用处，事JS中其他类型数据作为控制语句的条件判断时可以简写*/

        // var flag2 = undefined
        // var flag2 = 0
        // var flag2 = ""
        // var flag2 = null

        var flag2 = str1
        //在java中你得写if(str1 != null && str1.length > 0)
        if (flag2){
            document.write("convert to true")
        }else {
            document.write("convert to false")
        }

    </script>
</body>
</html>

流程控制

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flow Contr in JS</title>
</head>
<body>
  <script>
    //if
    var count = 3
    if (count == 3){
        document.write(count + "<br>")
    }

    //switch
    var num = 10
    switch (num){
        case 1: document.write("Monday")
            break
        case 2: document.write("Tuesday")
            break
        case 3: document.write("Wednesday")
            break
        case 4: document.write("Thursday")
            break
        case 5: document.write("Friday")
            break
        case 6: document.write("Saturday")
            break
        case 7: document.write("Sunday")
            break
        default: document.write("The data is illegal")
            break
    }

    document.write("<br>")

    //for
    var sum = 0
    for (let i = 1; i <= 100; i++){
        sum += i
    }
    document.write(sum+"<br>")

    //while
    var sum1 = 0
    var i = 1
    while (i <= 200){
        sum1 += i
        i++
    }

    document.write(sum1 + "<br>")

    //do while
    var sum2 = 0
    var k = 1
    do{
        sum2 += k
        k++
    }while (k <= 400)
    document.write(sum2)
  </script>
</body>
</html>

函数定义

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Function in JS</title>
</head>
<body>
    <script>
        //JS定义函数，参数不需要类型，返回值也不用写类型，直接函数体内return就行
        function add(a,b){
            return a + b
        }

        var rs = add(11,22)
        document.write(rs + "<br>")
        //参数个数可以跟函数定义的形参个数不一样，但又没效果不保证
        var rs1 = add(33,44,55)
        document.write(rs1 + "<br>")
        var rs2 = add(66)
        document.write(rs2 + "<br>")//此处结果是个NaN

        //JS定义函数的第二种方法，直接用一个var 接收函数的结果
        var minus = function (a,b){
            return b - a
        }

        var rs3 = minus(30,20)
        document.write(rs3 + "<br>")

    </script>
</body>
</html>