美文网首页
JavaScrpit基础语法和数据类型

JavaScrpit基础语法和数据类型

作者: 好多可乐 | 来源:发表于2020-07-15 23:04 被阅读0次

    JavaScript(简称“JS”) 是一种具有函数优先的轻量级,解释型或即时编译型的高级编程语言。虽然它是作为开发Web页面的脚本语言而出名的,但是它也被用到了很多非浏览器环境中,JavaScript 基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式和声明式(如函数式编程)风格。JavaScript由esmascript+dom+bom组成

    一. 引用

    1. JavaScript的引用方式:

    • 文件引用
      <script type="text/javascript" src="文件路径"></script>
    
    • 页面内嵌套
    <scrpit tyep="text/javascript">
    ...
    </script>
    
    

    2. 引用位置

    • 文件底部

    3. JavaScript的数据类型

    • java的基础数据类型有:int short byte long float double boolean char
    • js的基础数据类型:number(代表前6个) boolean string Null undefined
    • 变量的命名规范:匈牙利命名法,比如string类型,就是var s1;
    • 如果需要命名一个字符串,那么是string类型,就是s后面跟上1
    • 注意:打印null的类型的时候,会打印object而不是null,这是为什么呢?因为null是一个占位符,我们设置为null以后,后面往往会修改它的类型,比如 var n1=null;n1=333; 这个时候,它的类型会变为number
    // 如果需要命名一个字符串,那么是string类型,就是s后面跟上1
    var s1 = "sdff";
    // 如果是定义number类型的,因为number类型包含:int short byte long
    // float double,所以是这么定义
    var i1 = 1;
    var s1 = 2.2;
    var b1 = 1;
    var l1 = 123333333;
    var f1 = 1.231;
    var d1 = 1.344444;
    // 定义布尔类型
    var b1 = true;
    // 定义char类型
    var c1 = 'd';
    // 定义null类型
    var n1 = null;
    // 定义undefined类型
    var u1 = undefined;
    // 弹出变量类型 typeof
    alert(typeof n1)
    

    4. 定义JavaScript变量

    • 定义变量共有三种方式
    • es6之前唯一定义变量的标识:var
    • es6之后增加了2个:const,let
    • 注意:如果使用const和let报错,如果使用idea,可以进入setting-language-frameworks-JavaScript-选择es6以上版本并保存
         <!--定义变量--->
        <script type="text/javascript">
        var $_1 = 'ASSDD';
        //const:常量,要求在全局变量中定义,且不可变更
        const $_2 = "1efer";  //es6后不建议使用
        //let:主要在代码块中进行变量的定义,这样可以区分全局变量和局部变量
        function a() {
            let $_3 = "22dff";
        }
        </script>
    

    5.JavaScript不同类型的条件运算规则

       //    number条件类型运算规则,0/NaN(not a number)返回的条件类型是false,其他都是true
       if (NaN){
           alert(true)
       } else {
          alert(false)
       }
        //    string类型的运算规则,空字符串表示false,其他的都为true
        if (""){
            alert(true)
        } else {
            alert(false)
        }
        //   undefined条件类型的运算规则为false
        if (undefined){
            alert(true)
        } else {
            alert(false)
        }
        //    null类型的运算规则为false
        if (null){
            alert(true)
        } else {
            alert(false)
        }
    

    6.JavaScript的运算符

    1. 逻辑运算符
    JavaScript的逻辑运算符有:与&&,或||,非!,任何与NaN参与的条件运算符,都返回false,其他的语法规则和java是一样的

      if ("abc" || "") {
             alert(true)
      }else {
             alert(false)
      }
    

    2. 一元运算符
    我们常使用一元运算符 + - 进行类型转换,
    但是我们还是常用+号,因为如果写-号的话,如果后面跟的数字是负数,会负负得正

     var i2 = +"3"
     alert(typeof (i2))   //输出结果为number
     var i3=-"4"
     alert(typeof (i3))   //输出结果为number
     var i4=-"-5"
     alert(typeof (i4)+" "+i4)   //输出结果为number 5
    
    

    3. 算数运算符

    • 算术运算符包括:+ - * / % ++ --
    • 运算时左右两侧的算数值先转换为number型,再进行计算
    • undefined值转换为number型就是NaN,它跟任何数做运算结果都是NaN
    • 如果加号的一侧是string类型,那么就相当于字符串拼接
    • 如果算术运算符两侧都是字符串,那么进行字符串直接比较,比较方式按位字符直接比较
    • 其他的语法规则和java是一样的
      var i5 = 1 + 1
      alert(typeof (i5) + " " + i5)   // number 2
      var i6 = 1 + true
      alert(typeof (i6) + " " + i6)   // number 2
      var i7 = 1 + false
      alert(typeof (i7) + " " + i7)   // number 1
      var i8 = 1 + null
      alert(typeof (i8) + " " + i8)   // number 1
      var i9 = 1 + undefined
      alert(typeof (i9) + " " + i9)   // number NaN
      var i10 = 1 + "abc"
      alert(typeof (i10) + " " + i10)  //string 1abc
      var i11 = "abc" + true
      alert(typeof (i11) + " " + i11)  //string abctrue
      var i12 = "abc" + undefined
      alert(typeof (i12) + " " + i12)  //string abcundefined
      var i13 = "abc" + null
      alert(typeof (i13) + " " + i13)    //string abcnull
    

    4. 比较运算符

    • 比较运算符: > < >= <=
    • 运算时左右两侧的算数值先转换为number型,再进行计算
    • 如果算术运算符两侧都是字符串,那么进行字符串直接比较,比较方式按位字符直接比较
        if (1 > 2) {
                alert(true)
            } else {
                alert(false)  //false
            }
            if (1 > true) {
                alert(true)
            } else {
                alert(false)   //false
            }
            if (true > false) {
                alert(true)
            } else {
                alert(false) //true
            }
            if (true > null) {
                alert(true)
            } else {
                alert(false) //true
            }
            if (undefined > null) {
                alert(true)
            } else {
                alert(false) //false
            }
            if (undefined >= null) {
                alert(true)
            } else {
                alert(false) //false
            }
            if (undefined <= null) {
                alert(true)
            } else {
                alert(false) //false
            }
            if (1 >="1"){
                alert(true)
            } else {
                alert(false)  //true
            }
            if (1>="b"){
                alert(true)
            } else {
                alert(false)  //false,无法转换,b不能转换为number,转换失败赋值为NaN
            }
            if ("112" > "21") {
                alert(false)
            } else {
                alert(true) //这里结果为false,因为两侧都是字符串的时候,是按位数进行比较,1>2,是false,所以直接为false
            }
    

    5. 等性运算符

    • 等性运算符:== != === !==
    • 其他的都跟java语法差不多,只有null有点特殊,这里并没有转为0,再进行对比
    • NaN参与的一切比较运算结果都为false,除了!=
    • === 与!==主要涉及类型转换问题,如果类型和值是一致的,就是全等,否则就不是全等
       if (0 == null) {
                alert(true)
            } else {
                alert(false)  //false
            }
            // false
            if (NaN == NaN) {
                alert(true)
            } else {
                alert(false)  //false
            }
            // true
            if (NaN != NaN) {
                alert(true)
            } else {
                alert(false)  //false
            }
            // 类型不一致,直接为false
            if (111 === "111") {
                alert(true)
            } else {
                alert(false)
            }
            // 类型不一致,所以不为全等,返回true
            if (111 !== "111") {
                alert(true)
            } else {
                alert(false)
            }
    
            if (1 === true) {
                alert(true)
            } else {
                alert(false)
            }
    

    相关文章

      网友评论

          本文标题:JavaScrpit基础语法和数据类型

          本文链接:https://www.haomeiwen.com/subject/azeshktx.html