美文网首页饥人谷技术博客
JavaScript的基本知识

JavaScript的基本知识

作者: 犯迷糊的小羊 | 来源:发表于2016-06-14 22:45 被阅读36次

    目录

    1. 语句、变量、标识符
    2. 条件语句和循环语句
    3. 数据类型

    1.语句、表达式、变量和标识符

    语句:完成特定指令的代码,相当于告诉计算机我要你完成什么操作

    • 语句以分号为结束标志
    • js执行代码的单位为行,一行可以包含多个语句
    //这是一个语句
    var a=1;
    //一行中可以包括多个语句,但要以分号隔开
    var a=1;var b=3;var c='hello world'
    

    表达式:一个返回值的计算式

    //赋值符'='的右边是一个表达式
    var a=1+3;
    

    变量:是一个可以装动态变化的值的容器,每个容器都要有名字,叫做变量名

    • 变量要事先声明才可使用
    var a;
    a=1;
    //等价于
    var a=1;
    //可以同时声明多个变量并赋值
    var a,b,c;
    var name="Gates", age=56, job="CEO";
    
    • 未声明变量而使用会报错
    • 只用var就可以声明所有类型的变量,与C语言不同
    //声明变量为数值
    var a=1;
    //声明变量为字符串
    var b="hello world";
    //声明变量为数组
    var c=[1,2,3]
    //声明变量为对象
    var d={"name": "teren","age": 18}
    
    • 变量可分全局变量和局部变量
      • 全部变量作用于整个作用域
      • 局部变量作用于局部的作用域
      • 全局变量若定义在函数体时,只有调用函数才会作用于全局
        【注】关于全局变量和局部变量以及作用域在后续文章完善

    变量提升:js引擎在解析js时,会先扫描一遍代码,然后再获取所有被声明的变量
    【注意】

    • 变量提升是提升到该作用域的最上面
    • 使用函数声明方法定义的函数将整个代码块进行提升
    • 函数作用域内声明的函数只有在调用时才提升
    //下面代码执行的顺序是var a; console.log(a) ; a=1
    console.log(a)
    var a=1;
    
    //下面代码中的var a是提升到f2(){}的花括号里面的最上面
    function f(){
      function f2(){
        console.log(a)
        var a=1
      }
      f2()
    }
    f()
    

    标识符:标识对象的命名规则

    • 首字符,可以是任意Unicode字母(包括英文字母和其他语言的字母),以及美元符号($)和下划线(_)。
    • 第二个字符及后面的字符,除了Unicode字母、美元符号和下划线,还可以用数字0-9
    • 不可以使用运算符,如+,-,*
    • 不可以使用js的保留字、关键字以及Infinity、NaN、undefined

    2.条件语句和循环语句

    条件语句:特定的语句集合,具有判断条件执行语句功能

    • if条件语句
    //if 语句
    var age=18;
    if (age<18){
      console.log('you are already a yougster')
    }
    //if else语句
    var fruit;
    fruit='apple';
    if (fruit='apple'){
      console.log('apple')
    }else{
      console.log('not an apple')
    }
    //if else if语句
    var fruit;
    fruit='orange';
    if (fruit==='apple'){
      console.log('apple')
    }else if(fruit==='peach'){
      console.log('peach')
    }else{
      console.log('i don\'t know')
    }
    //注意: 千万不可以写成if (fruit='apple')
    //if的嵌套
    var score=100;
    if (score>=60){
      if (score>=60 && score<70){
        console.log('D');
      }else if (score>=70 && score<80){
        console.log('C');
      }else if (score>=80 && score<90){
        console.log('B');
      }else{
        console.log('A');
      }  
    }else{
      console.log('fail');
    }
    
    • switch 语句
    var color='#fff';
    switch (color){
      case '#fff':
        console.log('white');
      break;
      case '#000':
         console.log('black');
      break;
      default:
        console.log('whatever');
    }
    

    【注意】switch语句后面的表达式与case语句后面的表示式,在比较运行结果时,采用的是严格相等运算符(===),而不是相等运算符(==),这意味着比较时不会发生类型转换。

    • 三元运算符
    var a,b;
    a=3;
    b=6;
    (a>b)?console.log(a):console.log(b)
    

    循环语句:用于重复执行特定操作

    • while循环
    var i;
    i=0;
    while (i<10){
      console.log(i);
      i++
    }
    
    • for 循环
    var i;
    for(i=0;i<10;i++){
      console.log(i);
    }
    
    • do while循环
      var i;
      i=0;
    do{
      console.log(i);
      i++
    }while (i<10);
    

    【注】do while语句会事先执行一句代码,再判断循环条件,同时注意while必须要以分号结尾

    3.数据类型

    无论是常量还是变量,只要存放或没存放值都会用相应的值的数据类型。JS的数据类型有6种:

    • 原始数据类型
      • 数值,包括整数和小数
      • 字符串
      • 布尔值
    • undefined
    • null
    • 对象
      • 狭义的对象
      • 数组
      • 函数
    • 判断数据类型的方法:typeof 运算符
      • 对于未声明的变量a,使用typeof a会显示undefined,不使用会直接报错
    a
    // ReferenceError: a is not defined
    typeof a
    // "undefined"
    

    【注】至于为什么会出现这种情况,笔者猜测前者js运行时整体逻辑的断错,而typeof是该方法对各种状况的考量

    typeof 123;
    
    "number"
    
    typeof '123'
    
    "string"
    
    typeof false
    
    "boolean"
    
    typeof undefined
    
    "undefined"
    
    typeof null
    
    "object"
    
    function a(){}
    
    undefined
    
    typeof a
    
    "function"
    
    a={}
    
    [object Object] { ... }
    
    typeof a
    
    "object"
    
    • 其他情况都返回object
    typeof window // "object"
    typeof {} // "object"
    typeof [] // "object"
    typeof null // "object"
    

    【注】以上内容整理主要出自阮一峰的技术博客、饥人谷导师的教学资源以及一些网络资料

    相关文章

      网友评论

        本文标题:JavaScript的基本知识

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