JS高级程序读书笔记（1）

发表于 | 分类于
ECMAScript与JavaScript
  • ECMAScript定义了JS语言的基础标准，规定了语法、语句、类型、关键字、保留字、操作符、对象
  • JS是对ECMAScript的实现。一个完整的JS由ECMAScript、文档对象模型（DOM）、浏览器对象模型（BOM）组成
文档对象模型DOM

用于HTML的应用程序编程接口，提供访问和操作网页内容的方法和接口。DOM把整个页面映射为一个多层节点的树形结构。开发人员可以通过DOM提供的API进行节点的增删改查操作

  • DOM分为3个级别，支持DOM是浏览器开发商的首要目标

    DOM1级：DOM核心模块+DOM HTML模块，主要是映射文档的结构

    DOM2级：增加DOM事件，DOM试图，DOM样式，DOM遍历和范围

    DOM3级：增加SVG等新接口

浏览器对象模型BOM

浏览器对象模型，提供与浏览器交互的方法和接口。

<script>加载外部js文件标签的位置

浏览器在遇到<body>标签时才开始呈现内容，所以一般放在<body>元素中内容的后面。如果放在<head> 标签里，就必须等js代码下载解析和执行完成后才能呈现页面内容，这期间浏览器窗口一片空白。

标识符

变量，函数，属性的名字，一般采用驼峰大小写格式

  • 第一个字符必须是字母，下划线_ ，美元符号$
  • 其他字符可以是字母，_ ，$， 数字
关键字和保留字
  • 关键字是具有特定用途的字符，不能用作标识符，比如new， var， if， return
  • 保留字是有可能将来被用作关键字，如double，private，package
null

null值表示一个空对象的指针，因此用typeof null 得出的结果是object。当定义的变量准备在将来用于保存对象时，可以初始化为null

1
2
3
if(car !== null){
  //对car 对象执行某些操作
}
boolean

转换为false的值：false , “”（空字符串）, 0 , null , undefined , NaN

number
  • 八进制数（0开头）：070
  • 十六进制（0x开头，后面跟0~9及A~F）：0xA

在进行计算是，都会被转为十进制数

NaN

NaN是一个非数值，任何值除以非数值都会返回NaN

  • NaN不等于任何值，包括自己
  • NaN任何计算操作都返回NaN
1
2
3
4
5
6
7
8
#isNaN(arg): 任何不能转为数字的arg都会返回true
isNaN('10') //false  能转为数值就返回false
isNaN('true')  //false
isNaN('hello')  //true
----------------
# Number.isNaN(arg)  //arg值是NaN就返回true，用来判断是否是NaN
Number.isNaN(0/0)  //true
Number.isNaN('NaN')  //false  字符串“NaN”不会转换为NaN
数值转换

  • Number()：可以用于任何数据类型

    1
    2
    3
    4
    5
    6
    Boolean值：true返回1，false返回0
    null值：返回0
    "" 空字符串：返回0
    undefined值：返回NaN
    其他进制的数字都转换为：十进制数
    其他类型的值，返回NaN

  • parseInt(str, 进制数)：常用来处理整数的转换，处理字符串，返回数字。第二个参数指定转换的进制数，最好不要省略

    • 忽略字符串前的空格，直到找到第一个非空格字符
    • 忽略字符串数字后面的非数字，只转换数字部分parseInt("1234blue",10) //1234
    • 如果第一个字符不是数字或者负号，返回NaN
    • 只处理有效数字，小数点不是有效数字parseInt(22.5, 10) //22

  • parseFloat(str) ：只有一个参数，可以处理浮点数。而parseInt()只能返回整数

    1
    2
    parseFloat('3.125e7')  //31250000
    parseInt('3.125e7')  //3
字符字面量（转义序列）
  • \r ：回车（把打印头移到开头）windows系统里 \r\n表示换行
  • \n ：换行（向下移一行）mac系统里\n表示换行
  • \\：斜杠
  • \’：单引号

#####toString() 和String(value)

  • 除了null和undefined，其他类型都有toString()方法

  • 在不知道转换的值是不是null或者undefined的情况下，用String()方法

    1
    2
    String(null)  //"null"
    String(undefined)  //"undefined"
递增递减操作符++ & –

  • 放在数值变量前面，前置递增和递减操作符与执行语句的优先级相同

    1
    2
    3
    4
    var a = 2
    var b = 20
    var num1 = --a + b  //21
    var num2 = a + b  //21

  • 放在数值变量后面，执行语句优先级 > 后置递增和递减操作符

    1
    2
    3
    4
    var a = 2
    var b = 20
    var num1 = a-- + b  //22  这里先执行a+b，再执行a--
    var num2 = a + b  //21

  • ++ & –操作符适用于任何值

    1
    2
    var a = "z"  a++  //NaN 对于不能转化为数字的值，结果为NaN（非数字）
    var b = 'true'  b++ //2 布尔值true和false转化为1和0
逻辑操作符

  • 逻辑非：! ，返回相反的布尔值

  • 逻辑或：a||b||c ，最后一个值可以作为保底值。

    1
    2
    1 || false  //1   第一个值为true的情况下就不会对第二个值求值
    null || 2   //2

  • 逻辑与：a && b && c 

    1
    2
    1 && 2  //2  都为真的情况下返回第二个值
    undefined &&2 //undefined
运算操作符

  • 取余数：var result = 26 % 5 //1

  • 加法：

    1
    2
    var result1 = 5+5 //10
    var result2 = "5"+5  //"55"   字符串+数值 =>字符串
switch…case…语句
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# 每个case后面添加break，可以避免同时执行多个case
switch(expression){
  case value:statement
  	break;
  case value:statement
  	break;
  defalut:statement
}
--------------
var num = 25
switch(true){
  case num<20:
  	console.log('less than 20')
  	break;
  default:
  	console.log('more than 19')
}
函数的参数

参数在函数内部是用一个数组来表示的，可以传递任意数量的参数，并且可以通过arguments 对象来访问这些参数数组。arguments对象是个类数组，可以通过arguments[0]等访问，arguments.length表示传进来的传参数个数。

1
2
3
4
5
function test(){
  console.log(...arguments)
  console.log(arguments.length)
}
test(1,2,3,4)   //1 2 3 4   4
函数的返回值

未指定返回值的函数返回的是一个特殊的undefined值