《JavaScript语言入门教程》记录整理:入门和数据类型


  • 入门篇
    • js介绍
    • 历史
    • 基本语法
  • 数据类型
    • 概述
    • null 和 undefined
    • 数值
    • 字符串
    • 对象
    • 函数
    • 数组


本系列基于阮一峰老师的《JavaScrip语言入门教程》或《JavaScript教程》记录整理,教程采用知识共享 署名-相同方式共享 3.0协议。这几乎是学习js最好的教程之一(去掉之一都不过分)

最好的教程而阮一峰老师又采用开源方式共享出来,之所以重新记录一遍,一是强迫自己重新认真读一遍学一遍;二是对其中知识点有个自己的记录,加深自己的理解;三是感谢这么好的教程,希望更多人阅读了解

入门篇

js介绍

  1. JavaScript 是一种轻量级的脚本语言和嵌入式(embedded)语言,其只能通过宿主环境(host,浏览器或node环境)提供I/O操作
  2. 语法角度,JS是一种"对象模型"语言。支持函数式编程、"面向对象"编程、过程式编程等
  3. js核心语法包括:基本的语法构造(比如操作符、控制结构、语句)和标准库(就是一系列具有各种功能的对象比如Array、Date、Math等)。然后就是宿主提供的API(比如浏览器提供的BOM、DOM和Web互联网相关的类;Node环境提供文件操作API、网络通信API等)
  4. JavaScript 的所有值都是对象
  5. js可以采用事件驱动(event-driven)和非阻塞式(non-blocking)设计,实现高并发、多任务处理

历史

  1. 1995年,Brendan Eich 只用了10天,完成了js的第一版,其设计借鉴了C、java、Scheme、Awk、Self、Perl、Python等多种语言,同时也留下了各种设计缺陷(导致常常需要学习各种解决问题的模式)
  2. JavaScript与Java是两种不同的语言,两者的关系仅仅是js的基本语法和对象体系最开始是想要模仿Java,而后又与当时Java的公司Sun有合作,也借助Java的声势,从而后来改名叫JavaScript
  3. ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前者的一种实现。ECMAScript 只用来标准化 JavaScript 的基本语法结构。但其他标准如 DOM 的标准就是由 W3C组织(World Wide Web Consortium)制定的
  4. 2007年,ECMAScript 4.0版草案发布,但是过于激进,导致后面中止了 ECMAScript 4.0 ,将其中一小部分功能发布为ECMAScript 3.1。之后又将其改名为 ECMAScript 5。
  5. 2015年6月,ECMAScript 6 正式发布,且更名为“ECMAScript 2015”。之后每年发布一个ECMAScript版本
  6. 周边大事记

基本语法

  1. js执行单位是行(line),一行一行地执行,一般,一行就是一个语句
  2. 语句(statement)执行某种操作、表达式(expression)用于得到返回值。凡是 JavaScript 语言中预期为值的地方,都可以使用表达式(这一点使js某些使用很灵活)
  3. 语句以分号结尾,一个分号表示一个语句结束。多个语句可以写在一行内。分号前无内容,表示空语句。表达式不需要分号结尾
  4. 变量是对“值”的具名引用,即为"值"取名。变量的名字就是变量名。如下使用var声明一个变量a,并赋值1
var a=1;
  1. 只声明变量而不赋值,则该变量的值是undefined,表示"无定义"。同时变量赋值时不写var也有效,但不建议。变量必须先声明再使用,否则会报错not defined
  2. 一条var命令可以声明多个变量。js是动态类型语言,变量类型可以随时更改。
var a = 1;
a = 'hello';
  1. 使用var重新声明一个已存在的变量,是无效的,重新声明时赋值,相当于重新赋值
  2. 变量提升:js的执行方式是,先解析代码,获取所有被声明的变量,然后再一行一行地运行,这样就会导致所有变量的声明语句,会被提升到代码的头部,这叫做变量提升(hoisting)
  3. 标识符(identifier)指的是识别各种值的合法名称。比如变量名、函数名。js标识符大小写敏感。标识符的命名规则是:只能以字母、下划线(_)和美元符号($)开头,从第二个字符开始还可以使用数字。
  4. js标识符中的字母指的是Unicode字母。因此中文标识符也可以使用
  5. js中的保留字不能用于标识符,保留字是指js中用来表示特定含义的字符,如return、class、true、false、function等
  6. 注释:注释用来对代码进行解释,js引擎执行时会忽略注释部分。//表示单行注释。/* */表示多行注释
  7. js使用大括号表示"区块"(block)。对于var命令,js的区块不构成单独的作用域(scope)
  8. 条件语句:
  • if和if...else...结构,根据条件的布尔值判断执行。

  • switch结构判断表达式的值是否与case相符并执行,如果都不符则执行最后的default,case中break不能少,否则当前case代码块执行完会接着执行下一个case。switch语句部分和case语句部分,都可以使用表达式,这就是js中可以为值的地方,都可以使用表达式的体现,如下:

switch (1 + 3) {  case 2 + 2:
    f();    break;  default:
    neverHappens();
}

switch语句的值和case语句的值,比较时采用的是严格相等运算符(===)

  • ?:三元运算符:如下,条件true,执行"表达式1",否则执行"表达式2",然后获取对应返回值
(条件) ? 表达式1 : 表达式2
  1. 循环语句:重复执行某个操作
  • while 循环:循环条件和代码块,条件为真,就循环执行代码块

  • for 循环:可以指定循环的起点、终点和终止条件。分为初始化表达式(initialize)、条件表达式(test)、递增表达式(increment)

for (初始化表达式; 条件; 递增表达式) {
  语句
}

所有for循环,都可以改写成while循环

for语句的无线循环表示:

for ( ; ; ){  console.log('Hello World');
}
  • do...while 循环:先执行一次循环体,再判断条件
  • break语句用于跳出代码块或循环。continue语句用于立即终止本轮循环,并开始下一轮循环
  1. js语句的前面可以添加标签(label),相当于定位符,用于跳转到程序的任意位置
label:
  语句
数据类型

概述

  1. JavaScript的数据类型有六种(ES6新增了 Symbol 类型)
  • 数值(number):整数和小数(比如1和3.14)
  • 字符串(strin):文本(比如"Hello World")。
  • 布尔值(boolean):表示真伪的两个特殊值,即true(真)和false(假)
  • undefined:表示“未定义”或不存在,即由于目前没有定义,所以此处暂时没有任何值
  • null:表示空值,即此处的值为空。
  • 对象(object):各种值组成的集合。

数值、字符串、布尔值称为原始类型(primitive type),是最基本的数据类型。对象称为合成类型(complex type)。undefined和null两个特殊值。

对象分为:狭义的对象(object)、数组(array)、函数(function)

  1. 类型判断

typeof运算符返回一个值的数据类型:

  • 数值、字符串、布尔值分别返回number、string、boolean
  • 函数返回function,undefined返回undefined(可以检测未声明的变量),对象返回object,null返回object
// 检测未声明if (typeof v === "undefined") {  // ...}typeof window // "object"typeof {} // "object"typeof [] // "object"typeof null // "object"
  • instanceof可以区分数组和对象
[] instanceof Array // false[] instanceof Array // true

null 和 undefined

  1. 两者含义"类似",if语句中自动转为false,相等于运算符(==)两者比较为true。null表示"空"对象,转为数值是0;undefined表示"无定义"的原始值,转为数值是NaN
Number(null) // 0Number(undefined) // NaN
  1. 函数没有返回值时,默认返回 undefined
  2. 布尔值表示true和false两个真假状态。
  3. 如果 JavaScript 预期某个位置应该是布尔值,则会将该位置上现有的值自动转为布尔值。

下面六个值会被转为false,其他的值都是true:

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""或''(空字符串)

空数组([])和空对象({})对应的布尔值,都是true

数值

  1. js中所有数字都是以64位浮点数存储,整数也是如此。因此1===1.0,是同一个数
1 === 1.0 // true

JavaScript 语言的底层根本没有整数,所有数字都是小数(64位浮点数)

  1. 浮点数不是精确的值,因此小数的比较和运算要特别注意
0.1 + 0.2 === 0.3   // false0.3 / 0.1           // 2.9999999999999996(0.3 - 0.2) === (0.2 - 0.1)   // false
  1. js浮点数的64个二进制位,从最左边开始,由如下组成:
  • 第1位:符号位,0表示正数,1表示负数。数值正负
  • 第2位到第12位(共11位):指数部分。数值的大小
  • 第13位到第64位(共52位):小数部分(即有效数字)。数值的精度
  1. 绝对值小于2的53次方的整数,即$-253$到$253$,都可以精确表示
Math.pow(2, 53); // 9007199254740992Math.pow(2, 53) + 1; // 9007199254740992Math.pow(2, 53) + 2; // 9007199254740994Math.pow(2, 53) + 3; // 9007199254740996Math.pow(2, 53) + 4; // 9007199254740996
  1. 最大值和最小值:Number.MAX_VALUE和Number.MIN_VALUE
Number.MAX_VALUE // 1.7976931348623157e+308Number.MIN_VALUE // 5e-324
  1. 数值表示法:50(十进制)、0xFF(十六进制)、123e3或123e-3(科学计数法)
  2. 当小数点前面的数字多于21位时,或者小数点后的零多于5个时,js会自动将数值转为科学计数法表示
  3. 使用字面量(literal)表示数值时:
  • 十进制:没有前导0的数值
  • 八进制:有前缀0o或0O的数值,或者有前导0、且只用到0-7的八个阿拉伯数字的数值。
  • 十六进制:有前缀0x或0X的数值。
  • 二进制:有前缀0b或0B的数值。

js会自动将八进制、十六进制、二进制转为十进制

  1. js存在2个0:+0,-0,两者是等价的。唯一区别是+0或-0当作分母时表达式的返回值不相等。
  2. NaN表示“非数字”(Not a Number),比如字符串解析为数字报错时会返回NaN。0除以0得到NaN。NaN只是一个特殊值,类型依旧是Number
  3. NaN不等于任何值,包括它本身
NaN === NaN // false

NaN的布尔值为false,NaN与任何数(包括它自己)的运算,得到的都是NaN

  1. Infinity表示“无穷”,表示无法表示正无穷(Infinity)和负无穷(-Infinity);非0数除以0,得到Infinity。
    Infinity大于一切数值(除了NaN),-Infinity小于一切数值(除了NaN)

NaN的比较运算会返回false

  1. parseInt()方法将字符串转为整数。字符串转为整数时,会一个个字符依次转换,如果遇到不能转为数字的字符,就不再进行下去,返回已经转好的部分。转换失败返回NaN。

解析科学计数法的数字时会出现奇怪的结果

第二个参数表示解析的值的进制

parseInt('1000', 2) // 8parseInt('1000', 6) // 216parseInt('1000', 8) // 512
  1. parseFloat():将一个字符串转为浮点数,可以对科学计数法字符串正确转换
  2. isNaN()判断一个值是否是NaN。isNaN()只对数值有效,其他类型值会先转为数值,再判断。对于空数组和只有一个数值成员的数组,isNaN()返回false
isNaN('Hello') // true// 相当于isNaN(Number('Hello')) // true
  1. 判断NaN最好的方法是:NaN是唯一不等于自身的值
function myIsNaN(value) {  return value !== value;
}

如果使用isNaN()判断,要同时判断类型:

function myIsNaN(value) {  return typeof value === 'number' && isNaN(value);
}
  1. isFinite()判断是否为正常的数值,判断是参数也会进行类型转换

字符串

  1. 字符串是放在单引号或双引号中的零个或多个排在一起的字符。字符串中使用相同的引号要用\反斜杠转义
  2. 每行的尾部使用反斜杠,可以实现多行字符串(\后面只能有换行符,否则报错)
var longString = 'Long \
long \
long \
string';

longString // "Long long long string"

也可使用+可以将多个字符串行连接

  1. 反斜杠(\)用来表示一些特殊字符,称为转义。如\n换行符;\r:回车键;\t:制表符。如果在字符串中需要包含反斜杠,需要\转义自身。
"你好,反斜杠\\";  // "你好,反斜杠\"
  1. 字符串可以看做字符数组,但仅能使用数组的方括号运算符获取字符,而不能进行其他操作
  2. length属性返回字符串长度
'hello'.length  // 5
  1. js使用Unicode字符集。不仅以Unicode存储字符,而且可以只用Unicode码点,如'\u00A9'表示版权符号
var s = '\u00A9';
s // "©"

每个字符在 JavaScript 内部都是以16位(2个字节)的 UTF-16 格式储存。js单位字符长度固定为16位长度

js 对 UTF-16 的支持不完整,只支持两字节的字符,无法识别四字节的字符。比如四字节字符