在《JavaScript高级程序设计》的一些笔记

来源：互联网发布：powermill10软件下载编辑：程序博客网时间：2024/06/17 06:04

好记性不如…烂笔头

第二章

（2.1）使用<script>元素的方式有2种：嵌入式代码、外部文件
<script>元素有这些属性：
- async（表示应该立即下载脚本）；
- defer（相当于告诉浏览器立即下载，但延迟到整个页面被解析完毕后[即遇到</html>]再执行；使用方法：defer=”defer”，有的也直接defer）；
- src（在带有src的<script>脚本里的嵌入式代码会被忽略）；
- type（可以不指定，默认为text/JavaScript）；

只要不存在async、defer属性，浏览器都会按照`<script>`元素在页面中出现的先后顺序依次解析。

（2.1.1）<script>标签的位置：

+ 放在<head>里放到</body>前内容动态执行的方法（即在body里面的onclick触发）；当页面加载时，立即执行的内容；通常被用来生成页面内容好处它能确保脚本在任何调用前被加载在解析JavaScript代码前，页面的内容已经完全呈现在浏览器中，会感觉加快了。缺点必须等到全部JavaScript代码都被下载、解析和执行完成后，才开始呈现页面的内容（浏览器遇到<body>时才开始呈现内容），可能导致空白。不能保证脚本在调用前就结束加载

<head>里面默认只会加载，不会执行，需要通过<body>里面一些方法触发执行。所以变量的初始化等都不能放到<head>里面，要放到<body>里面。

也可以用JQ的$(function(){…})、window.onload,在HTML 全部加载 到浏览器后，马上执行代码；

（2.1.2）延迟脚本：
- 用defer="defer"（或者直接defer）属性，立即下载，但延迟执行；
- 有些浏览器不支持defer，所以将代码放到</body>前是最佳选择

（2.1.3）异步脚本：async
目的：不让页面等待此脚本的下载和执行，从而异步加载页面其他内容。为此，建议异步脚本不要在加载期间修改DOM

async和defer只适用于外部脚本，并告诉浏览器立即下载文件。但是async并不保证按照它们的先后顺序执行。

（2.2）最好用外部文件来包含JavaScript代码：
- 可维护性
- 可缓存（两个页面都使用同一个文件，那这个文件只需下载一次）
- 适应未来

（2.3）IE5.5引入了“文档模式”：混杂模式、标准模式；
前者是在文档开始处没有发现文档类型声明时，默认开启。不提倡，因为在不同浏览器下，这种模式差别大；
后者是通过<!DOCTYPE HTML>声明

第三章

（3.1.1）ECMAScript 中的一切（变量、函数和操作符）都区分大小写

（3.1.2）标识符 就是指变量、函数、属性的名字，一般用 驼峰命名法

（3.1.2）注释
- //单行注释
- /*多行注释*/

（3.1.5）养成习惯：
- 每个语句都以分号结尾；
- 每个条件控制语句 都使用代码块 { }

（3.2）关键字和保留字：
关键字 用于表示控制语句的开始或结束，或者用于执行特定的操作等。
break、do、instanceof、typeof、
case、else、new、var、
catch、finally、return、void、
continue、for、switch、while、
debugger、function、this、with、
delete、in、try

保留字 有可能在将来被用作关键字
abstract、enum、int、short、
boolean、export、interface、static、
byte、extends、long、super、
char、final、native、synchronized、
class、float、package、throws、
const、goto、private、transient、
debugger、implements、protected、volatile、
double、import、public

（3.3）有关变量的一些不推荐的做法：

①修改变量所保存值的类型：
var message = "hi"; message = 100; // 有效，但不推荐
②在局部作用域中，有意地省略var定义全局变量

（3.4）数据类型 有5种简单数据类型 + 1种复杂数据类型
简单数据类型 ：Undefined、Null、Boolean、Number、String
复杂数据类型 ：Object

ECMAScript 不支持任何创建自定义类型的机制，所有制最终都将是上述6种数据类型之一

（3.4.1）typeof操作符 （用法：typeof(…)）

返回的字符串（6种）含义 “undefined” 未声明或未初始化 “boolean” 布尔值 “string” 字符串 “number” 数值 “object” 是个对象或null或是array “function” 函数

（3.4.2）Undefined
- 未初始化的变量的值，都会取得undefined值

未定义或未初始化，对于typeof都会返回undefined，所以，一般我们写代码时，显式地初始化，这样typeof得到undefined后我们就确定是未声明导致的了。

（3.4.3）Null
- null表示一个空对象指针，所以typeof检测null值时会返回”Object”

只要意在保存对象的变量在还没有真正保存对象之前，就应该明确地让该变量保存null值。（这样做不仅可以体现null中作为空对象指针的惯例，而且也有助于进一步区分null和undefined）

（3.4.4）Boolean
该类型只有两个字面值：true和false （区分大小写哦）

有个方法叫Boolean(…)，它用于把…转换成boolean，然后返回true/false。

数据类型转为true 转为false String 任何非空字符串 “” Numer 任何非零数字值 0或NaN Object 任何对象 null

（3.4.5）Number
常用的十进制
八进制：

var message = 070 ; （有前导零，为56）
var message = 081 ; （后面的数值超出范围，忽略前导零，为81）

十六进制：

var message = 0xA ; （前两位必须为0x，后跟0~9及A~F，字母可大写可小写）

在计算时，会自动转成十进制哦

浮点数值

即必须包含一个小数点，并且小数点后面必须至少有一位数字

- 可以用e表示法（科学计数法）表示浮点数值：
- var floatNum = 3.125e7 ; // 等于31250000

保存浮点数值需要的内存空间是保存整数值的2倍
-用浮点数值计算算术计算时，其 精确度 远远不如整数，所以不要用
if(a + b == 0.3){…} //不要做这样的测试

NaN

即非数值，是一个特殊的数值，表示一个本来要返回数值的操作数未返回数值的情况（这样就不会抛出错误了）

任何涉及NaN的操作，都会返回NaN
NaN与任何值都不相等，包括NaN本身
有个isNaN（）函数，它接受一个任何类型的参数，判断这个参数是否“不是数值”。它会先转换成数值，不能转换的就是NaN，返回true

    alert(isNaN(NaN));//true    alert(isNaN(10));//false    alert(isNaN("10"));//false    alert(isNaN("blue"));//true（"blue"不能转换成数值）    alert(isNaN("true"));//false

数值转换

三个函数：Number( )、parseInt( )、parseFloat( )

Number( )可以用于任何数据类型
parseInt( )、parseFloat( )专门用于把字符串转换成数值

Number( )

参数的数据类型原数值转换为 Boolean true 1 Boolean false 0 Number 1 1 null null 0 字符串 134（纯数字；浮点数同理） 134 字符串 “”（空） 0 字符串 0x15（十六进制） 21 字符串除了上面的格式 NaN

由于Number（）在转换字符串时比较复杂而不够合理，因此处理整数的时候更常用parseInt（）：

parseInt（）
特点：
- 尽可能的从头发掘数值
- 若字符串为空，直接NaN
- 若字符串都是非数值，直接NaN
- 若第一个字符不是数值，或者负号，直接NaN
- 若第一个字符是数值，继续解析第二个，直到第一个非数值停止解析

var num1 = parseInt(“12ab34”) ; // 12

一般会parseInt(AF,16) ; //即第二个参数指定基数，这样就少出很多错

parseFloat（）
- 和parseInt（）类似，也是从第一个字符开始解析每个字符，而且也是一直解析到字符串末尾，或者解析到遇见一个无效的浮点数字字符为止
- 和parseInt（）不同，它只解析十进制值，没有第二参数指定基数的用法

（3.4.6）String类型
用于表示由零个或多个16位Unicode字符组成的字符序列，即字符串
字符串一旦创建，它们的值就不能改变。要改变某个变量保存的字符串，首先要销毁原来的字符串，然后再用另一个包含新值得字符串填充该变量，例如：

var lang = "Java"lang = lang + "Script"

以上示例中的变量lang一开始包含字符串“Java”，而第二行代码把lang的值重新定义为“Java”和“Script”的组合，即“JavaScript”。实现这个操作的过程如下：
首先创建一个能容纳10个字符的新字符串；
然后在这个字符串中填充“Java”和“Script”；
最后是销毁原来的字符串“Java”和字符串“Script”。

转换成字符串：toString（）

可选参数：2、8、10、16这些进制

var num = 10 ;alert(num.toString())  ; // "10"alert(num.toString(2)) ; // "1010"var num1 = null;var num2 ;var num3 = true;alert(num1.toString()) ; // 报错！null没有toString（）方法alert(num2.toString()) ; // 报错！undefined没有toString（）方法alert(num3.toString()) ; // "true"

在不知道要转换的值是不是null或undefined的情况下，可以使用转型函数String（），可以将任何类型的值转换为字符串

转型函数String（）

如果值有toString（）方法，则用String（）会返回与toString（）相同结果
如果值是null，则返回”null”
如果值是undefined，则返回”undefined”

（3.4.7）Object类型
ECMAScript中的对象其实就是一组数据和功能的集合。对象可以通过执行new操作符后跟要创建的对象类型的名称来创建。
var o = new Object( );
Object的每个实例都具有下列属性和方法：
- constructor（构造函数）：保存着用于 创建当前对象 的函数，即上面的Object（）
- hasOwnProperty（propertyName）：用于检查 给定的属性 在当前对象实例中，是否存在
- isPrototypeOf（object）：用于检查 传入的对象 是否是当前对象的原型
- toString（）：返回对象的字符串表示
- valueOf（）：返回对象的字符串、数值或布尔值表示，通常和toString（）相同

（3.5）操作符
包括：算术操作符、位操作符、关系操作符、相等操作符
（3.5.1）一元操作符
对数值前，加一个一元加操作符，将会像Number（）转型函数一样，对这个值进行转换。

（3.5.2）位操作符
- 整个过程就像是只存在32位的整数一样
- 正数、负数都是用二进制码存储，只不过负数使用的格式是二进制补码

负数的二进制补码求法（假设8位数）：
1、求这个数值绝对值的二进制码原码
2、因为是负数，取最高位为1，然后将①所求的二进制 按位取反
3、将②得到的数，最低位加1
- 只不过ECMAScript会尽力向我们隐藏所有这些信息。
- 换句话说，在以二进制字符串形式输出一个负数时，我们看到的只是这个负数绝对值的二进制码（即①所求）前面加上了一个负号（而不是上面所求的二进制补码哦），但是事实上他存储的数值的确就是那个二进制补码来的！

按位非（NOT） ~
    也就是转成二进制数，按位取非
按位与（AND） &
     两个数值的对应位都是1时，才返回1
按位或（OR） |
     两个数值的对应位有一个为1，即可返回1
按位异或（XOR）^
     两个数值的对应位（为0/1搭配）时，才返回1
左移 <<
     将制定数值的所有位向左移动指定的位数
- 最后的空位用0填补
右移（有符号） >>

（3.5.3）布尔操作符
逻辑非 !
逻辑与 &&
- 属于短路操作，如果第一个操作数能够决定结果，那么就不会再对第二个操作数求值
逻辑或 ||
- 也属于短路操作

（3.5.4）乘性操作符
*
/
%

（3.5.5）加性操作符
+ （两个都是字符串，拼接；一字符串，一数值，将数值转换再拼接）
- （会把非数值都转换成数值Number（），都成数值了，再计算，出现了NaN，直接报NaN）

（3.5.6）关系操作符

（3.5.7）相等操作符

相等(==) 和 不相等(!=)—— 先转换，再比较
重点排序：number > string、number > boolean
null == undefined //true

全等(===) 和 不全等(!==) —— 仅比较，不转换
===未经转换就相等，返回true
!==未经转换就不相等，返回true
由于相等和不相等操作符存在类型转换问题，而为了保持代码中数据类型的完整性，我们推荐使用全等和不全等操作符。

（3.5.8）条件操作符
var max = (num1 > num2) ? num1 : num2;

（3.5.9）赋值操作符

num += 10 ; // num = num + 10;

（3.5.10）逗号操作符

（3.6）语句
（3.6.2）do-while
循环体内至少会执行一次

do{    statement} while (expression);

（3.6.3）while
循环体有可能一次也不执行

while(expression){    statement}

（3.6.4）for
初始化表达式、控制表达式、循环后表达式都是可选的。

for(;;) //无限循环

（3.6.5）for-in
精确的迭代语句，可以用来枚举对象的属性

for(var propName in Window){    document.write(propName);}

（3.6.6）label
可以由break或continue引用，且一般都要与for语句等循环语句配合使用

（3.6.7）break和continue
break：立即退出循环，执行循环结束后，接下来的语句
continue：不退出循环，接下来执行的是下一次循环，跳的时候它将忽略：循环内、continue后的语句。

break搭配label：

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;        }        num++;    }}alert(num); //55

由此可见，break搭配label，可以退出整个label所指的大循环！

continue搭配label：

var num = 0;outermost:for(var i = 0; i < 10 ; i++){    for(var j =0; j < 10 ; j++){        if(i == 5 && j ==5){            continue outermost;        }        num++;    }}alert(num); //95

由此可见，continue搭配label，不能退出label所指的大循环，最多只能跳出至他再下一层（亲测），最后一层还是没出来
（3.6.8）with
作用是将代码的作用域（即{…}内）设置到一个特定的对象中。

//旧代码：var qs = location.search.substring(1);var hostName = location.hostname;var url = location.href;//新代码：with(location){    var qs = search.substring(1);    var hostName = hostname;    var url = href;}//在with语句的代码块内部，每个变量首先被认为局部变量；//如果在这个局部环境里面，找不到该变量的定义，那么就会查询和with关联的location对象中是否有同名的属性；//若有，则以location对象属性的值，作为变量的值

（3.6.9）switch
switch使用的是全等操作符，因此不会发生类型转换！

switch除了一般用法，还可以这样用：

    var num = 25;    switch(true){        case num < 0 :                    alert("Less than 0");                    break;        case num >=0 && num <= 10:                    alert("Between 0 and 10");                    break;        default:                    alert("More than 20");}//这种写法是因为每条case语句都会返回一个布尔值//所以会每个case按照顺序求职，直到匹配的值或者遇到default为止

（3.7）函数
- 无需指定函数的返回值，任何函数在任何时候都可以通过return语句后跟要返回的值，来实现返回值。
- 并且，执行完return语句后，停止并立即退出函数，根本不会不执行后面的语句
- 还有啊，return语句也可以不带任何返回值（直接写return;的话默认返回undefined）

（3.7.1）理解参数
- ECMAScript中的参数在内部使用一个数组来表示的，所以他不介意传递进来多少个参数
- 还可以用arguments对象来访问这个参数数组，从而获取传递给函数的每一个参数
- arguments[0]、arguments[1]…，对了！arguments.length可以获得已传参长度
- arguments对象中的值会自动反映到对应的命名参数；不过他们的内存空间是独立的，只是值是同步的
- 如果实际上值传递1个参数，那么就算在函数内指定arguments[1]=10，那第二个命名参数也不会自动同步值

ECMAScript中的所有参数传递的都是值（地址也算值），不可能通过引用传递参数

（3.7.2）没有重载
- 因为ECMAScript函数没有签名，因为其参数是由包含零或多个值的数组来表示的，所以是没有重载的
- 若定义了两个名字相同的函数，以后面的为准！

阅读全文

0 0