读书笔记(06) - 语法基础 - JavaScript高级程序设计

语法基础

写在开头

本篇是小红书笔记的第六篇,也许你会奇怪第六篇笔记才写语法基础,笔者是不是穿越了。

答案当然是没有,笔者在此分享自己的阅读心得,不少人翻书都是从头开始,结果永远就只在前几章。
对此,笔者换了随机阅读的方式,哪章感兴趣了或者想补知识点,再去翻阅对应的章节。当然目录还是要翻的。

工作生活节奏太快,知识太多,时间与知识的增长成反比,求全不如求专,也许不能看完全书,但至少掌握所需知识点。


语法基础

思维导图是个好东西,一图流。

语法

标识符

  1. 由字母,下划线_,美元符号$,数字组成
  2. 第一个字符不能是数字
  3. 注意不要使用关键字作标识符
  4. 对象属性[]号写法可不遵循标识符规则 obj[123] = 123

数据类型

数据类型共有10个,ES5有7个,3个为ES6新增

1
number/boolean/string/undefined/object/null/function/symbol/set/map

  1. 判断类型可用typeof
  2. 判断对象为何种引用类型可用instanceof

undefined与null

  1. undefined (使用var声明但未初始化)
  2. null (空对象指针)
1
undefined == null // true

NaN

NaN表示本来应返回一个数值,结果未正确返回

  1. NaN不等于任何值,且不等于自身
  2. isNaN()可判断是否为NaN

数值转换

Number() 转型函数

参数值 结果
true 1
false 0
null 0
undefined NaN
‘’ 0
‘168’ 168
‘168hello’ NaN
‘hello’ NaN

TIPS:参数值为一个对象,则先调用valueOf(), 没有再调用toString(), 然后遵循上述规则

parseInt()

  1. 第一个参数为转换的值
  2. 第二个参数为转换的进制
  3. 会尝试解析字符串前面的数字(不同于Number())
1
parseInt('168hello') -> 168

parseFloat()

  1. 第一个小数点有效,忽略后面小数点的解析
  2. 会尝试解析字符串前面的数字
  3. 忽略前导0,只支持10进制,没有第二个参数 (不同于parseInt())
1
parseFloat('520.13.14') -> 520.14

字符串转换

toString() 方法

  1. 大多数数据类型拥有toString()方法,可在参数中指定转换进制
  2. null/undefined 没有toString()方法

String() 转型函数

  1. 如果参数值有toString()方法,则调用toString()方法
  2. null 转为 "null"
  3. undefined 转为 "undefined"

函数 function

  1. 不支持重载
  2. 后定义的函数会覆盖之前
  3. 参数数组对象:arguments

语句

  1. if...else...
  2. do...while... 后测试循环,不同于while/for前测试循环
  3. while
  4. for
  5. for...in... 遍历对象属性
  6. labelbreak/continue 合用
  7. switch...case... case 全等判断
  8. with 将代码作用域设置到特定的对象中

switch…case

  1. case 判断时是全等判断,不会进行类型转换
  2. case 值不一定是常量,可以是变量,甚至是表达式
1
2
case 'hello' + 'word';
case num < 10;

label

label语句允许在代码中添加标签,labelbreak/continue联合使用,可返回代码指定位置

1
2
3
4
5
6
7
8
9
10
11
12
var num = 0;
outermost:
for (var i = 0; i < 10; i++) {
for (var j = 0; j < 10; j++) {
if ( i== 5 && j == 5) {
break outermost;
// 退出循环(因为outermost定义的位置在最外层)
// 普通的break只能跳出一层循环
}
}
}

with

with语句的作用是将代码的作用域设置到一个特定的对象

1
2
3
4
// window.location 对象为例子
with(location) {
var url = href; // location.href
}

操作符

  1. 一元操作符
  2. 布尔运算符
  3. 算数运算符
  4. 关系运算符
  5. 条件运算符
  6. 赋值预算符
  7. 逗号运算符

一元操作

一元操作符指的是只能操作一个值的操作符

  1. 递增++
  2. 递减--
  3. 后置:语句被求值后执行自身赋值
1
2
3
var a = 2;
var b = 20;
var c = a-- + 20; // 后置运算 c: 22, a: 1

布尔运算符

逻辑非!

!! 功能等于 Boolean() 转型函数

逻辑与 &&
  1. 第一参数是对象,返回第二个参数
  2. 第一个参数为null/NaN/undefined, 则直接返回第一个参数
逻辑或 ||

规则与逻辑与相同,不同的是只要第一个参数成立则不会进行后续运算

TIPS:逻辑与或都属于短路运算,并不一定返回true/false,参数未声明可能会报错或赋值不成功

算数运算符

1
+, -, *, /, %

关系运算符

1
<, >, <=, >=, ==, ===, !=, !===
  1. 两个参数都是数值,进行值比较
  2. 两个参数都是字符串,进行字符编码比较(大写字母的字符编码小于小写字母)
  3. 一个参数是数值,则转为数值比较
  4. 一个参数是对象,则先调用其valueOf(),没有valueOf()再调用toString()
  5. === 全等会进行值与类型的比较
  6. null == undefined // true

条件运算符

三元表达式

1
2
var score = 90;
var achie = score > 90 ? '优秀' : '再接再厉';

逗号操作符

逗号操作符可以在一条语句执行多个操作,常用于变量初始化

TIPS: 用于赋值时,逗号操作符会返回表达式最后一项的值

1
var name = 'KenTsang', age = 28, job = 'Developer';

详解逗号表达式,可移步笔者的文章:《一道JS面试题引发的血案》

if-else/switch-case/?:/&&/||可移步笔者的文章: 《JS中 if/ if…else替换方式》


参考文档

作者:以乐之名
本文原创,有不当的地方欢迎指出。转载请指明出处。

坚持原创技术分享,您的支持将鼓励我创作出的更好文章分享!