JS基本语法

338 阅读6分钟

JS版本

  • ES 6 是最低要求

历史版本

  • ES 3, IE 6支持,总体评价:垃圾
  • ES 5, 总体评价:还是垃圾
  • ES 6, 大部分浏览器支持,总体评价:一半垃圾一半好
  • ES 2019 与 ES 6 差别不大

为什么说ES 6一半垃圾

  • 因为ES 不能删除以前的特性,要兼容旧网站
  • 也就是说以前能运行的网站,没以后都要能运行
  • 对比Python 3 你就能知道兼容的好处: 稳定

综上所述:JS这门语言并不完美,我们要明白其中的糟粕

  • 为什么不去学更优美的语言呢,比如别人说的python等等?

一门语言的价值

  • 是由其产生的价值决定
  • JS是世界上使用最广的语言
  • JS是门槛极低的语言(只要你不学糟粕)
  • JS是一门能产生价值的语言(虽然不美)比如html5带来的直播便利

JS之父对JS的评价

  • 早期
  • 它的优秀之处并非原创,它的原创之处并不优秀。
  • ES6出来后,好了点

一些人对JS的批评

  • 王垠(yin)
    • 很多JS程序员也盲目地鄙视Java,而其实JS比Python和Ruby还要差
    • JS的社区以幼稚和愚昧著称。你经常发现一些非常基本的尝试,被JS砖家们当成了不起的发现似的,在大会上宣讲
  • 道格拉斯(JSON之父)
    • JS脚本语言一定会消失,最终被抛弃!
    • 上面这句话我并没有找到原话(但这个人确实又爱又恨JS)
  • 一些人对JS的辩护
    • 世界上只有两种编程语言,一种是天天挨骂,一种是没人用的
    • JS:世界上最被误解的语言

JS语法

表达式与语句

-表达式 - 1+2 表达式的值为函数的返回值 - add(1,2)表达式的值为函数的返回值(返回值是函数的值) - console.log表达式的值为函数本身 - console.log(3)表达式的值为多少?undefined,3只是打印出来的东西

  • 语句

    • var a = 1 是一个语句 (a也算环境吧)
  • 两者的区别

    • 表达式一般都有值,语句可能有也可能没有
    • 语句一般会改变环境(声明、赋值)
    • 上面两句话并不是绝对的

大小写敏感

  • 不要写错
    • var a 和 var A 是不同的
    • object 和 Object 是不同的
    • function 和 Function 是不同的
    • 具体含义后面说

空格

  • 大部分空格没有实际意义
    • var a = 1和 var a=1没有区别
    • 加回车大部分时候也不影响
    • 只有一个地方不能加回车,那就是returen后面

标识符

  • 规则

    • 第一个字符,可以是Unicode 字母或$或_或中文
    • 后面的字符,除了上面所说,还可以有数字
  • 变量名是标识符

    • var _=1
    • var $=2
    • var ______=6
    • var 你好 = "hi"
  • 其他标识符用到再说

  • 一个常见的报错:

    • Uncaught SynataxError:Synatax就是语法的意思
    • Invalid or unexpected token就是不合法的或者不期望遇到的“token=字符串”

注释

  • 杠星 xxxx 星杠
  • 注释写得多不一定就是越好
  • 注释的分类
    • 不好的注释
      • 把代码翻译成中文
      • 过时的注释
      • 发泄不满的注释(产品是许多人的心血不能因为你一个人原因毁了他)
    • 好的注释
      • 踩坑注解
      • 为什么代码会写得这么奇怪,遇到什么bug

区块block

  • 把代码包在一起
{
    let a = 1
    let b = 2
}
  • 常常与if / for / while 合用

if 语句

  • 语法

    • if(表达式) {语句1} else {语句2}
    • {}在语句只有一句的时候可以省略,不建议这样做
  • 变态情况

    • 表达式里可以非常变态,如 a = 1
    • 语句1里可以非常变态,如嵌套的if else
    • 语句2里可以非常变态,如嵌套的 if else
    • 缩进也可以很变态,如面试题常常下套
    • 如果有个逗号。。就能把两句变成一句话了!
a = 1
if(a === 2)
    console.log('a')
    console.log('a等于2')
    答案是a等于2
  • 使用最没有歧义的写法——程序员戒律
  if{
      
  }
  else if{
      
  }
  else{
      
  }

或者

    if{
        return xxx;
    }
    if{
        return xxx;
    }
    if{
        return xxx;
    }
    

switch 语句————新手不推荐, 容易用错,但是得知道

  • 语法
    switch (fruit){
        case "bannana":
         // ...
        break;
        case "apple"
         // ...
         break;
        default:
         //...
    }
  • break
    • 大部分时候,省略break你就完了(容易跨到另一个case)
    • 少部分时候,可以利用break
    • swift 的switch语句设计得就很人性化

问号冒号表达式

  • 表达式1?表达式2:表达式3
    • 其实看成一个简洁版的if else语句

&&短路逻辑

读作andand

  • A&&B&&C&&D 取第一个假值(比如说A是假的,那么值就是A,很奇葩,因为A是假,他没有一个叫做假的值,所以取值为A)

  • 如果能用&&代替if 语句那肯定最好是用

||短路逻辑

读作或或

  • A||B||C||D取第一个真值

条件语句总结

  • 条件语句
    • if else
    • switch
    • A?B:C
    • A&&B
    • fn && fn()
    • A||B
    • A= A||B

while 循环

当xxx时

  • 语法

    • while(表达式){语句}
    • 判断表达式的真假
    • 当表达式为真,执行语句,执行完再判断表达式的真假
    • 当表达式为假,执行后面的语句
  • 其他

    • do...while 用的不多,自行了解
  • 变态

var a = 0.1;
 while(a!==1){
        a = a+0.1;
    }
  • 这是一个死循环,原因是浮点数不精确,加着加着就变成9.999,再加就跳过1变成1.xxxx,也就是说他永远到达不了1,程序就一直执行直到cpu爆炸

for循环

  • 语法糖

    • for 是 while 循环的方便写法
    • 方便在哪?
  • 语法

    • for(语句1(初始化);表达式2(判断);语句3(执行循环体后才执行这个)){循环体}
    • 先执行语句1
    • 然后判断表达式2
    • 如果为真,执行循环体,然后执行语句3
    • 如果为假,直接退出循环,执行后面的语句
  • setTimeout

    • 会在原本的语句执行完再执行这个,
for(var i = 0; i<5; i++) {
        setTimeout{()=>{
            console.log(i)
        })
    }

结果是五次5

  • 如果初始化语句不是var而是let,会有另一种逻辑,后面讲

  • 如果你不写表达式2,或者语句3,你会死循环

break 和 continue

退出所有循环V.S.退出当前一次循环
PS:break可以退出离他最近的一个循环

label 用得比较少,面试会考(概率5%)

  • 语法
foo: {
    console.log(1);
    break foo;//跳出代码块foo
    console.log('本行不会输出');
}

console.log(2);
  • 面试
    {
        foo:1
    }
    
    • 上面的东西是什么?
    • firefox里的表现:代码块里有一个标签foo,语句是1
    • 在chrome里的表现:没加;会把foo当成对象,加了就没事

JS语法推荐书籍

  • 阮一峰的免费教程:入门篇
  • 你不知道的JavaScrit:先买上卷,适合进阶