JavaScript 进修笔记一 (入门篇)

JavaScript 进修笔记一 (入门篇)

近来正在看《JavaScript高等程序设计》,一向没来得及总结一下,趁便对之前看的《JavaScript DOM编程艺术》举行一些简朴的总结,若有一些不正确的处所还请多指出议论。

第1章 基本观点

1.1 辨别大小写

在进修 JavaScript 之前要明白的第一个观点就是在 ECMAScript 中一切的统统(变量、函数名和操纵符)都是辨别大小写的。比方变量 test 和 Test 是两个差别的变量,typeof 不能用在函数名上,因为它是一个关键字,但 typeOf 完全可以是一个函数名,因为在 ECMAScript 中变量、函数名和操纵符等等都是辨别大小写的。

1.2 标识符

在进修之前还须要相识的第二个观点就是「标识符」,所谓标识符就是指变量、函数、函数的参数和属性的名字,标识符可以以下花样划定规矩组合起来的一个或多个字符:

  • 第一个字符必须是是字母、下划线(_)或许美圆标记($)。
  • 其他字符可以是字母、下划线、美圆标记或许数字。

根据通例,ECMAScript 标识符采纳驼峰大小写花样,也就是第一个字母小写,剩下的每一个单词的首字母大写,比方:

  • firstSecond
  • myCar
  • doSomethingImportant

第2章 数据范例

ECMAScript 中有 5 种基本数据范例:Undefined、 Null、 Boolean、 String 和 Number。另有 1 种庞杂数据范例:Obect,Object 本质上是由一组无序的名值对构成。ECMAScript 不支撑任何建立自定义范例的机制,而一切值终究都将是上述 6 种数据范例之一。

2.1 typeof 操纵符

因为 ECMAScript 是松懈范例的,所以须要有一种要领来检测给定变量的数据范例,typeof 就是担任供应这方面信息的操纵符。对一个值运用 typeof 操纵符可以返回以下某个字符串:

  • “undefined”,假如这个值未定义;
  • “boolean”,假如这个值是布尔值;
  • “string”,假如这个值是字符串;
  • “number”,假如这个值是数值;
  • “object”,假如这个值是对象或 null;
  • “function”,假如这个值是函数。

比方:

var message = "Some Message!"

alert(typeof message); // "string"
alert(typeof(message)); // "string"
alert(typeof 95); // "number"

由此可以看出 typeof 操纵符的操纵数可以是变量(message),也可以是数值字面量。注重,typeof 是一个操纵符而不是函数,所以例子中的圆括号只管可以运用,但不是必须的。

这里须要注重一下的是,假如对 null 举行 typeof 操纵的话,会返回 “object”,因为 null 会被认为是一个空的对象援用。另有一些比较新鲜的返回值,比方 Safari 5 及之前的版本、 Chrome 7 及之前的版本在对正则表达式挪用 typeof 操纵符时会返回 “function”,而在其他浏览器下则会返回 “object”。

2.2 Undefined 范例

Undefined 范例的值只需一个,即特别的 undefined。当用 var 关键字声明一个变量但未对它举行初始化时,这个变量的值就是 undefined,比方:

var message;
alert(message == undefined); // true

这个例子只对 message 举行了声明,但未对其举行赋值操纵,此时 message 的值就是 undefined,这个例子和下面这个例子是等价的:

var message = undefined;
alert(message == undefined); // true

这个例子运用 undefined 值显式初始化了变量 message。但我们没有必要这么做,因为未经初始化的值默许就会获得 undefined 值。

关于 Undefined 范例另有一点须要注重的就是,声清楚明了变量然则未对其举行初始化赋值操纵和基本就没有声明变量是差别的:

var message; // 声明变量后默许获得 undefined

// 下面这个变量基本没有声明
// var age;

alert(message); // undefined
alert(age);// Uncaught ReferenceError: age is not defined

关于第一个正告框人人肯定没疑问,弹出的应当是 “undefined”,因为传递给第二个正告框的是一个未说明的变量,所以在这里会致使一个毛病。

关于还没有说明的变量,只能对其举行一项操纵,即运用 typeof 对其举行数据范例的推断。不过有一点比较新鲜的就是,对未举行初始化赋值操纵的变量和未说明的变量运用 typeof 操纵符,都邑返回 “undefined”:

var message; // 声明变量后默许获得 undefined

// 下面这个变量基本没有声明
// var age;

alert(typeof message); // "undefined"
alert(typeof age); // "undefined"

效果表明对未举行初始化赋值操纵的变量和未说明的变量运用 typeof 操纵符,都邑返回 “undefined”。

2.3 Null 范例

Null 范例是第二个只需一个值的数据范例,这个特别的值是 null。从逻辑角度来看,null 值示意一个空对象指针,而这也恰是运用 typeof 操纵符检测 null 值时会返回 “object” 的缘由,以下面的例子所示:

var car = null;
alert(typeof car); // "object"

假如定义的变量预备在未来用于保留对象,那末最好将该变量初始化为 null 而不是其他值。如许一来,只需直接搜检 null 值就可以晓得响应的变量是不是已保留了一个对象的援用,以下面的例子所示:

if (car != null){
    // 对 car 对象实行某些操纵
}

实际上,undefined 值是派生自 null 值的,因而 ECMA-262 划定对它们的相称性测试要返回 true:

alert(null == undefined); //true 

这里有一点也要注重的是,这里的相称操纵符(==)出于比较的目标,会对比较的两个范例举行范例转换(背面会对这个知识点举行一些细致的总结)。

只管 undefined 派生自 null,但它们的用处却不雷同,不管在什么状况下都没有必要对一个变量的值显现的赋值为 undefined,而一样的原理对 null 却不实用,换句话说,只需意在保留对象的变量还没有真正的保留对象,就应当明确地地让该变量保留 null 值。如许做不仅可以表现 null 作为空对象指针的通例,也有助于进一步的辨别 undefined 和 null。

2.4 Boolean 范例

Boolean 范例的值有两个,离别是 true 和 false,这两个值和数字值不是一回事,也就是说 true 不肯定即是 1,false 不肯定即是 0,另有一点值得注重的是文章一最先就强调的一个观点,在 ECMAScript 中一切的统统都是辨别大小写的,所以 True 和 False (以及其他夹杂大小写的情势)并非 Boolean 范例的两个值,只是标识符。以下是为变量赋 Boolean 范例值的例子:

var found = true;
var lost = false;

只管 Boolean 范例的值只需两个,然则在 ECMAScript 中,一切范例的值都有与这两个 Boolean 值等价的值,将恣意一种范例的值转换为对应的 Boolean 值,可以挪用转型函数 Boolean(),比方:

var message = "Hello World!";
var messageAsBoolean = Boolean(message);

上面这个例子中,message 字符串被转换成了 Boolean 值,转换后的 Boolean 值被储存在变量 messageAsBoolean 中。可以对任何数据范例的值挪用 Boolean() 函数,而且总会返回一个 Boolean 值。至于详细返回是 true 照样 false 则要要详细的状况而定,下面给出了转换的划定规矩:

数据范例转换为true的值转换为false的值
Booleanturefalse
String任何非空字符串“”(空字符串)
Number任何非零数字值(包括无限大)0和NaN(拜见本章背面有关NaN的内容)
Object任何对象null
Undefinedn/a①undefined

2.5 Number 范例

Number 范例应当算是几种基本数据范例中比较庞杂的范例吧。

在 Number 范例中,最简朴的应当算是十进制整数吧,十进制整数可以直接像下面如许在代码中输入:

var intNum = 9; // 整数 9

除了十进制以外,整数还可以用二进制、八进制和十六进制来示意。

个中八进制必须以 0 开首,然后是八进制数字序列(0-7),假如字面中的值超出了局限,则第一个 0 将被疏忽,背面的数值将被当做十进制数值剖析

var num1 = 070; // 八进制 56
var num2 = 079 // 无效的八进制数,被剖析成十进制数 79
var num3 = 08; // 无效的八进制数,被剖析成十进制数 8

八进制字面量在严厉形式下是无效的,会致使支撑的 JavaScript 引擎抛出毛病。

十六进制必须以 0x 开首,然后是十六进制数字序列(0-9 及 A-F),个中字母可以大写也可以小写,比方:

var num1 = 0xA; // 十六进制的 10
var num2 = 0x1f; // 十六进制的 31

在举行算数盘算时,一切的八进制和十六进制示意的数值终究都将被转换成十进制数值。

2.5.1 浮点数值

浮点数值必须包括一个小数点,且小数点背面必须要有一名**非 0 **数字才算是浮点数值,假如小数点后没有数字,则 ECMAScript 会自动疏忽这个小数点,小数点前面则不肯定要有数字,但不引荐这类写法:

var num1 = 1.1;
var num2 = 0.1;
var num3 = .1; // 有用但不引荐
var num4 = 1.; // 小数点背面没有数字,被剖析为 1
var num5 = 1.0; // 被剖析成整数 1

因为浮点数值所需的内存是整数数值所须要的内存的两倍,所以 ECMAScript 会不失时机的将浮点数值转化为整数。

另有一点须要注重的是,浮点数值的最高精度是 17 位小数,在举行算术盘算的时刻其精度远远不如整数数值。比方,0.1 加上 0.2 的效果并非 0.3,而是 0.30000000000000004。这个小小的舍入偏差会致使没法测试特定的浮点数值,比方:

var a = 0.1;
var b = 0.2;

if (a + b = 0.3) { // 不要这么测试
    alert("You got 0.3.");
}

2.5.2 数值局限

因为内存的限定,ECMAScript 并不能保留一切的数值,ECMAScript 可以示意的最小数值保留在 Number.MIN_VALUE 中,可以示意的最大数值保留在 Number.MAX_VALUE 中,详细的来讲,假如一个数值超出了 ECMAScript 所能保留的数值局限,而且假如这个值是负数,则会被转换成 -Infinity(负无限),假如这个值是正数,则会被转换成 +Infinity(正无限)。

假如一个数被转换成了无限大(Infinity),则不能举行下一次运算,因为 Infinity 是不能被运算的数值。要想肯定一个数值是不是是有穷的(是不是是最大值和最小值之间),可以运用 isFinite() 函数来肯定,假如处于最大值和最小值之间,则会返回 true,比方:

var result = Number.MAX_VALUE + Number.MAX_VALUE;
var min = Number.MIN_VALUE;
var max = Number.MAX_VALUE;
alert(isFinite(result)); // false
alert(isFinite(min)); // true
alert(isFinite(max)); // true

由上可知,最大值和最小值也算是有穷的。

2.5.3 NaN

NaN 即非数值(Not a Number)是一个特别的数值,NaN 是用来示意原本应当返回一个数值却没有返回数值的状况(如许就不会抛出非常了),比方在 ECMAScript 中,0 除以 0 并不会报错,而是会返回 NaN,因而不会影响其他代码的实行。在这里有一点须要注重的是,并非恣意数值除以 0 都邑返回 NaN 的,比方:

alert(0 / 0); // "NaN"
alert(1 / 0); // "Infinity"
alert(-1 / 0); // "-Infinity"
alert(NaN / NaN); //"NaN"

由上可知,当正数除以 0 的时刻,返回的是 Infinity,当负数除以 0 的时刻,返回的是 -Infinity,只需 NaN 或许 0 初除以 0 的时刻返回的才是 NaN。

NaN 有两个特性,起首,任何触及 NaN 的操纵都邑返回 NaN;其次,NaN 与任何值都不相称,包括 NaN 自身。比方下面代码会返回 false:

alert(NaN = NaN); // false

为了推断某个数值是不是是「非数值」,ECMAScript 定义了 isNaN() 函数,该函数接收一个恣意范例的参数,假如这个参数是 NaN,则返回 true,假如不是 NaN,则返回 false,比方:

alert(isNaN(NaN)); // true
alert(isNaN(10)); // false(10 是一个数值)
alert(isNaN("10")); // false(可以被转换成数值 10)
alert(isNaN("blue")); // true(不能转换成数值)
alert(isNaN(true)); // false(可以被转换成数值 1)

由上可知,假如一个参数不能被转换成数值,则 isNaN() 函数会返回 true。

值得一提的是,isNaN() 函数一样实用于对象,在对对象挪用 isNaN() 时,会起首挪用对象的 valueOf() 要领试图把对象转换为数值,假如不能转换为数值,则基于这个对象再挪用 toString() 要领,在测试返回的值。

2.5.4 数值转换

可以把非数值转换成数值的函数有 3 个,离别是 Number()、 parseInt() 和 parseFloat()。个中 Number() 实用于任何数据范例,别的两个则特地用于把字符串转换成数值。

Number() 函数的转换划定规矩以下:

  • 假如是 Boolean 值,true 和 false 将离别被转换为 1 和 0。

  • 假如是数字值,只是简朴的传入和返回。

  • 假如是 null 值,返回 0。

  • 假如是 undefined,返回 NaN。

  • 假如是字符串,遵照以下划定规矩:

    • 假如字符串中只包括数字(包括前面带正号或负号的状况),则将其转换为十进制数值,即”1″会变成 1,”123″会变成 123,而”011″会变成 11(注重:前导的零被疏忽了);

    • 假如字符串中包括有用的浮点花样,如”1.1″,则将其转换为对应的浮点数值(一样,也会疏忽前导零);

    • 假如字符串中包括有用的十六进制花样,比方”0xf”,则将其转换为雷同大小的十进制整数值;

    • 假如字符串是空的(不包括任何字符),则将其转换为 0;

    • 假如字符串中包括除上述花样以外的字符,则将其转换为 NaN。

    • 假如是对象,则挪用对象的 valueOf()要领,然后遵照前面的划定规矩转换返回的值。假如转换的效果是 NaN,则挪用对象的 toString() 要领,然后再次遵照前面的划定规矩转换返回的字符串值。

下面则是一些详细的例子:

var num1 = Number("Hello world!"); //NaN
var num2 = Number(""); //0
var num3 = Number("000011"); //11
var num4 = Number(true); //1 

parseInt() 的转换划定规矩以下:

var num1 = parseInt("1234blue"); // 1234
var num2 = parseInt(""); // NaN
var num3 = parseInt("0xA"); // 10(十六进制数)
var num4 = parseInt(22.5); // 22
var num5 = parseInt("070"); // 56(八进制数)
var num6 = parseInt("70"); // 70(十进制数)
var num7 = parseInt("0xf"); // 15(十六进制数)

parseInt() 在转换字符串的时刻会疏忽字符串前面的空格,直到找到第一个非空格字符,假如第一个字符不是数字字符或许负号,parseInt() 就会返回 NaN;假如第一个字符是数字字符,parseInt() 会继承剖析第二个字符,晓得剖析完一切后足字符或遇到了一个非数字字符。有一点应当注重的是 parseInt() 转换空字符串时会返回一个 NaN,而 Number() 转换一个空字符串则会返回数字 0。

parseInt() 默许剖析的是十进制数,但也可以剖析指定的进制,比方:

var num1 = parseInt("10", 2); //2 (按二进制剖析)
var num2 = parseInt("10", 8); //8 (按八进制剖析)
var num3 = parseInt("10", 10); //10 (按十进制剖析)
var num4 = parseInt("10", 16); //16 (按十六进制剖析)

parseInt() 可以接收第二个参数,第二个参数只能是 2、 8、 10 和 16,离别对应响应的进制。为了防止毛病,当我们用 parseInt() 转换数值时指定响应的进制黑白常有必要的。

parseFloat() 的转换划定规矩以下:

var num3 = parseFloat("22.5"); //22.5
var num4 = parseFloat("22.34.5"); //22.34
var num5 = parseFloat("0908.5"); //908.5
var num6 = parseFloat("3.125e7"); //31250000 

与 parseInt() 相似,parseFloat() 也是从第一个字符最先剖析每一个字符,一向剖析到字符串的末端,或许剖析到一个无效浮点数字字符为止。与 parseInt() 差别的是,parseFloat() 剖析到的第一个小数点是有用的,而第二个小数点则无效,因而它背面的字符串也将被疏忽。与 parseInt() 第二个差别的是 parseFloat() 会一直疏忽第一个 0。

另有一点须要注重的是,假如字符串包括的是一个可剖析为整数的数(没有小数点,或许小数点后都是零),parseFloat() 会返回整数:

var num1 = parseFloat("1234blue"); //1234 (整数)
var num2 = parseFloat("1234.000"); //1234 (整数)

parseFloat() 只剖析十进制数,所以它不接收第二个参数,这也是为何 parseFloat() 一直会把十六进制的数值转换成 0 的缘由:

var num2 = parseFloat("0xA"); // 0

2.6 String 范例

String 范例示意字符串,可以由双引号(””)或单引号(”)示意,所以下面这两种字符串都是有用的:

var firstName = "Clear";
var lastName = 'Design'; 

但有一点须要注重的是,以什么引号开首就必须以什么引号末端,比方下面这类写法就是毛病的:

var name = "Clear Design';

2.6.1 字符字面量

String 数据范例包括一些特别的字符字面量,也叫转义序列,以下:

字面量寄义
\n换行
\t制表
\b空格
\r回车
\f进纸
\\斜杠
\’单引号(’),在用单引号示意的字符串中运用。比方:’He said, \’hey.\”
\”双引号(”),在用双引号示意的字符串中运用。比方:”He said, \”hey.\””
\xnn以十六进制代码nn示意的一个字符(个中n为0~F)。比方,\x41示意”A”
\unnnn以十六进制代码nnnn示意的一个Unicode字符(个中n为0~F)。比方,\u03a3示意希腊字符Σ

2.6.2 字符串的特性

ECMAScript 中的字符串是不可变的,字符串一旦建立,它们的值就不能转变。要转变某个变量保留的字符串,起首要烧毁本来的字符串,然后再用另一个包括新值的字符串添补该变量,比方:

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

上面的 lang 最先时包括 “Java”,而第二行代码把 lang 从新定义为 “Java” 和 “Script” 的组合,即 “JavaScript”。第二行代码并非把本来的 lang 的值转变了,而是起首建立一个能包容 10 个字符的新字符串,然后在这个字符串中添补 “Java” 和 “Script”,因为新的字符串拼接完成后,本来的字符串已没有用了,所以本来的字符串 “Java” 和 “Script” 会被烧毁,这些都是发作在背景的。

2.6.3 转换为字符串

前面提到 Number 数据范例的时刻有提到 parseInt() 和 parseFloat() 两个函数,这两个函数的作用是将可转换成数值的字符串转换成数值,而 String 数据范例一样也供应了一个 toString() 函数,它的作用是把可转换为字符串的数据范例转换成字符串:

var age = 22;
var ageAsString = age.toString(); // "22"

var found = true;
var foundAsString = found.toString(); // "true"

Number、 Boolean、 Object 和 String(没错,String 自身也具有 toString() 要领,该要领返回该字符串的一个副本)都有 toString() 要领,但 Null 和 Undefined 没有这个要领。

toString() 要领接收一个参数,参数只能是 2、 8、 10 和 16,离别对应响应的进制。比方:

var num = 10;
alert(num.toString()); // "10"
alert(num.toString(2)); // "1010"
alert(num.toString(8)); // "12"
alert(num.toString(10)); // "10"
alert(num.toString(16)); // "a" 

默许状况(没有传入参数)下 toString() 要领以十进制花样返回数值的字符串示意。在不晓得传入的值是不是是 Null 或 Undefined 的时刻,可以运用 String() 转型函数,该函数支撑把恣意数据范例的值转换为字符串,String() 函数的转换划定规矩以下:

  • 假如值有 toString() 要领,则挪用该要领(没有参数)并返回响应的效果;
  • 假如值是 null,则返回 “null”;
  • 假如值是 undefined,则返回 “undefined”。

下面再看几个例子:

var value1 = 10;
var value2 = true;
var value3 = null;
var value4;

alert(String(value1)); // "10"
alert(String(value2)); // "true"
alert(String(value3)); // "null"
alert(String(value4)); // "undefined" 

2.7 Object 范例

Object 范例是 ECMAScript 中 6 种数据范例中唯一一种庞杂数据范例,简朴的说的话 ECMAScript 中对象就是一组数据和功用的鸠合。建立对象的要领有许多,这里说一下比较经常使用的一种要领,就是经由过程实行 new 操纵符后跟要建立的对象范例的称号来建立:

var o = new Object();

在相识对象之前,起首要先明白一个主要的头脑:在 ECMAScript 中,Object 范例是一切它的实例的基本。也就是说,Object 范例所具有的任何属性和要领也一样存在于更详细的对象中。

Object 的每一个实例都具有以下属性和要领:

  • constructor:保留着用于建立当前对象的函数。关于前面的例子而言,组织函数(constructor)就是 Object()。

  • hasOwnProperty(propertyName):用于搜检给定的属性在当前对象实例中(而不是在实例的原型中)是不是存在。个中,作为参数的属性名(propertyName)必须以字符串情势指定(比方:o.hasOwnProperty(“name”))。

  • isPrototypeOf(object):用于搜检传入的对象是不是是传入对象的原型(第 5 章将议论原型)。

  • propertyIsEnumerable(propertyName):用于搜检给定的属性是不是可以运用 for-in 语句
    (本章背面将会议论)来罗列。与 hasOwnProperty() 要领一样,作为参数的属性名必须以字符串情势指定。

  • toLocaleString():返回对象的字符串示意,该字符串与实行环境的区域对应。

  • toString():返回对象的字符串示意。

  • valueOf():返回对象的字符串、数值或布尔值示意。一般与 toString() 要领的返回值雷同。

在 ECMAScript 中,Object 是一切对象的基本,也是 ECMAScript 中须要控制的重点,所以笔者将在背面的进修笔记中细致地对 Object 举行总结,这里就先相识一些 Object 范例的基本观点的要领。

2.8 总结

以上部份主如果笔者对 ECMAScript 中的一些基本观点的简朴总结,本篇主要写的照样在进一步进修 ECMAScript 中须要相识的一些基本且主要的观点。

若有写的不好的处所还请多指出议论。

原文地点:http://www.cleardesign.me/javascript-study-note-1

    原文作者:大板栗
    原文地址: https://segmentfault.com/a/1190000003057333
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞