一、JavaScript是什么?
JavaScript的核心语言特性在ECMA-262中是以名为ECMAScript(EuropeanComputer Manufacturers Association )的伪语言的形式来定义的。ECMA, 该协会指定 39 号技术委员会负 责 “ 标 准 化 一 种 通 用 、 跨 平 台 、 供 应 商 中 立 的 脚 本 语 言 的 语 法 和 语 义 ” 。虽然 JavaScript 和 ECMAScript 通常都被人们用来表达相同的含义,但 JavaScript 的含义却比 ECMA-262 中规定的要多得多。没错,一个完整的 JavaScript 实现应该由下列三个不同的部分组成(见图 1-1)。
(一)、JavaScript 组成
核心(ECMAScript)、文档对象模型(DOM)、浏览器对象模型(BOM)
ECMAScript中包含了所有基本的语法、操作符、数据类型以及完成基本的计算任务所必须的对象,但没有对取得输入和产生输出的机制作出规定。理解ECMAScript及其纷繁复杂的各种细节,是理解其在Web浏览器中的实现——JavaScript的关键。目前大多数实现所遵循的都是ECMA-262第5版,但很多都已经着手用第6版了。
(二)、ECMAScript种基本的要素
1 ECMAScript中的基本数据类型包括Undefined、Null、Boolean、Number和String。
2 与其他语言不同,ECMAScript没有为整数和浮点数值分别定义不同的数据类型,Number类型可用于表示所有数值。
3 ECMAScript中也有一种复杂的数据结构,即Object类型,该类型是这门语言中所有对象的基础类型。
4 严格模式为这门语言中容易出错的地方施加了限制。
5 ECMAScript提供了很多与C及其他类C语言中相同的基本操作符,包括算数操作符、布尔操作符、关系操作符、相等操作符及赋值操作符等。
6 ECMAScript从其他语言中借鉴了许多流控制语句,例如if语句、for语句和switch语句等。
(三)、ECMAScript中的函数与其他语言中的函数不同之处
1 无须指定函数的返回值,因为任何ECMAScript函数都可以在任何时候返回任何值。
2 实际上,未指定返回值的函数返回的是一个特殊的undefined值。
3 ECMAScript中也没有函数签名的概念,因为其函数参数是以一个包含零或多个值的数组的形式传递的。
4 可以向ECMAScript函数传递任意数量的参数,并且可以通过arguments对象来访问这些参数。
5 由于不存在函数签名的特性,ECMAScript函数不能重载。
二 语法规则:
(一)、命名规则
ECMAScript的一切(如变量、函数名和操作符)都区分大小写。ECMAScript标识符采用驼峰式大小写格式,标识符是按照下列规则组合起来的一或多个字符:
- 第一个字符必须是一个字母、下划线(_)或一个美元符号($);
- 其他字符可以是字母、下划线、美元符号或数字。
- 第一个单词以小写字母开始;第二个单词的首字母大写或每一个单词的首字母都采用大写字母
(二)、注释规则
ECMAScript采用C风格注释,包括单行注释和块级注释,如下所示:
// 单行注释 /* * 这是一个多行 * (块级)注释 * /
(三)、严格模式
ECMAScript5引入了严格模式(strict mode)的概念。严格模式下,ECMAScript3中的一些不确定的行为将得到处理,而且对某些不安全的操作也会抛出错误。要在整个脚本中启用严格模式,在顶部添加"use strict",在函数内部上方包含这条编译指示,也可以制定函数在严格模式下执行:
function doSomething(){ "use strict"; //函数体 }
三、变量
ECMAScript的变量是松散类型的,使用var操作符定义变量,省略var操作符会创建一个全局变量。
function test(){ message = "hi"; // 全局变量 } test(); alert(message); // "hi"
三、 数据类型
(一)、数据类型分类
原始类型(基础类型,简单类型)
1、Number 数字
2、String 字符串 在JS中一对引号之间的 0 到 多个字符串
3、Boolean 布尔值 true false
4、null 空值 (空对象) 空值不能进行属性操作 会报错
5、undefined 未定义
6、Symbol (ES6 新增)
复合类型(复杂类型)
1、Object 对象: Array 数组, function 函数, element,elements , Object 对象 {}
ECMAScript中有5中简单数据类型:Undefined、Null、Boolean、Number和String。对一个值使用typeof操作符可以检测给定变量的数据类型。
(一)、Number类型
这种类型使用IEEE754格式来表示整数和浮点数值。 ECMAScript并不能保存世界上所有的数值,它能够表示的最小数值保存Number.MIN_VALUE中——在大多数浏览器中,这个值时5e-324;对应的最大数值保存在Number.MAX_VALUE中——在大多数浏览器中,这个值是1.7976931348623157e+308。如果计算结果超出,正的被转为Infinity,负的被转为-Infinity。想确定一个数是不是有穷的,可以使isFinity()函数。
有三个函数可以把非数值转换为数值:Number()、parseInt()和parseFloat()。第一个函数,即转型函数Number()可以用于任何数据类型,而另两个则专门用于把字符串转换成数值。
(二)、String类型
String类型用于表示由零或多个16位Unicode字符组成的字符序列,即字符串。字符串可以由双引号(”)或单引号(’)表示,两者等价。ECMAScript中的字符串是不可变的,也就是说,字符串一旦创建,它们的值就不能改变。要改变某个变量保存的字符串,首先要销毁原来的字符串,然后再用另一个包含新值的字符串填充该变量。
任何字符串的长度都可以通过访问其length属性取得。
把一个值转换为一个字符串有两种方式。一种是使用几乎每个值都有的toString()方法,在调用数值的toString()方法时,可以传递一个参数:输出数值的基数;在不知道要转换的值是不是null或undefined的情况下,还可以使用转型函数String()。
(三)、Boolean类型
该类型只有两个字面值:true和false。 虽然Boolean类型字面值只有两个,但ECMAScript中所有类型的值都有与这两个Boolean值等价的值。要将一个值转换为其对应的Boolean值,可以调用转型函数Boolean(),如下例所示:
var message = "Hello world!";
var messageAsBoolean = Boolean(message);
下满给出各数据类型及其转换的规则:
数据类型 |
转换为true的值 |
转换为false的值 |
Boolean |
true |
false |
String |
任何非空字符串 |
“”(空字符串) |
Number |
任何非零数字值(包括无穷大) |
0和NaN(参见本章后面有关NaN的内容) |
Object |
任何对象 |
null |
Undefined |
n/a |
undefined |
(四)、Null类型
Null 类型是第二个只有一个值的数据类型,这个特殊的值是 null。从逻辑角度来看, null 值表示一个空对象指针,而这也正是使用 typeof 操作符检测 null 值时会返回"object"的原因,如下面的例子所示:
var car = null; alert(typeof car); // "object
(五)、Undefined类型
Undefined只有一个值,即特殊的undefined。使用var生命单位对其加以初始化时,变量的值就是undefined。对未声明的变量执行typeof操作符也会返回undefined。
注意:即便未初始化的变量会自动被赋予undefined值,但显式地初始化变量依然是明智的选择。如果能够做到这一点,那么当typeof操作符返回"undefined"值时,我们就知道被检测的变量还没有被声明,而不是尚未初始化。
(六)、NaN
NaN,即非数值(Not a Number)是一个特殊的数值,这个数值用于表示一个本来要返回数值的操作数未返回数值的情况(这样就不会抛出错误了)。例如,任何数值除以0会返回NaN。NaN有两个非同寻常的特点,任何涉及NaN的操作(例如NaN/10)都会返回NaN。其次,NaN与任何值都不相等,包括NaN本身。可以用isNaN()确定这个参数是否“不是数值”。isNaN()在接收到一个值后,会尝试将这个值转换为数值。某些不是数值得值会直接转换为数值,例如字符串“10”或Boolean值。而任何不能被转换为数值的值都会导致这个函数返回true。例如:
alert(isNaN(NaN)); //truealert(isNaN(10)); //false(10是一个数值)alert(isNaN("10")); //false(可以被转换成数值10)alert(isNaN("blue")); //false(不能被转换成数值)alert(isNaN(true)); //false(可以被转换成数值1)
(七)Object类型
ECMAScript中的对象其实就是一组数据和功能的集合。对象可以通过执行new操作符后跟要创建的对象类型的名称来创建。Object类型是所有它的实例的基础,Object的每个实例都具有下列属性和方法。
1、constructor:保存着用于创建当前对象的函数。对于前面的例子而言,构造函数(constructor)就是Object()。
2、hasOwnProperty(propertyName):用于检测给定的属性在当前对象实例中(而不是在实例的原型中)是否存在。其中,作为参数的属性名(propertyName)必须以字符串形式指定(例如:o.hasOwnProperty("name"))。
3、isPrototypeOf(object):用于检查传入的对象是否是传入对象的原型。
4、propertyIsEnumerable(propertyName):用于检查给定的属性是否能够使用for-in语句(本章后面将会讨论)来枚举。与hasOwnProperty()方法一样,作为参数的属性名必须以字符串形式指定。
5、toLocaleString():返回对象的字符串表示,该字符串与执行环境的地区对应。
6、toString():返回对象的字符串表示。
7、valueOf():返回对象的字符串、数值或布尔值表示。通常与toString()方法的返回值相同。
五 、数据类型转换
(一)、强制数据类型转换
1、强制转换为数字
parseInt(string, radix) 将数据转换为整数返回,parseFloat(string) 转换成浮点数(也就是小数),第一个参数接受的是个字符串也就是我们要转换的数据,第二个参数 基数,也可以理解为 标注出我们要转换的这个字符串是几进制的数字
Number(val) 将数据转换成数字字符串类型,使用 Number() 转换时,规则如下:
-
布尔值类型,使用 Number() 转换时,true 返回1,false 返回 0
-
当整段字符串都复合数字规则时,转换为数字返回
- 空字符串,直接返回 0
-
null,使用 Number() 转换时 返回 0
-
undefined,使用 Number() 转换时 返回 NaN
-
对象类型,使用 Number() 转换时,调用的对象的toString()方法,然后再次依照前面字符串的转换规则进行转换
2、NaN 和 isNaN
在使用 NaN 时,要注意 NaN 不等于任何值,包括它自己,也就是 NaN 不等于 NaN。当我们要检测一条数据是否是 NaN 时,可以使用 isNaN(val) 来进行检测, 在 isNaN 方法中,传入的数据 能被转换成 合法数字时,就会返回 false,当传入的数据不能被转换成 合法数字( 也就是NaN) 时,isNaN 就会返回 true
3、String(val) 转换成字符串
-
数字类型,直接转换数据类型原样返回
-
undefined ,直接返回字符串 undefined
-
null,直接返回字符串 null
-
布尔值,直接返回字符串 true 或者 false
-
函数,直接把整个函数变成字符串 返回
-
对象,直接调用对象的 toString 方法
4、Boolean(val) 转换成布尔值
-
数字类型:非零的合法数字转换为 true, 零代表 false, NaN 代表 false
-
字符串类型:空字符串转换为false,非空字符串转换为true
-
null:转换为false
-
对象:转换为true
(二)、隐式类型转换
隐式数据类型转换,也就是说这个转换过程不受我们强制, js 偷偷自己转的
六、操作符
名称 |
操作符 |
例子 |
一元操作符 |
|
|
递增操作符 |
++ |
var age=29;++age; //age为30 |
递减操作符 |
– |
var age=29;--age; //age为28 |
一元加操作符 |
+ |
var b=false;b=+b; //变成了数值0 |
一元减操作符 |
- |
var b=false;b=-b; //变成了数值0 |
位操作符 |
|
|
按位非 |
NOT(~) |
var num1=25;var num2=~num1;alert(num2); //-26 |
按位与 |
AND(&) |
var result=25 & 3;alert(result);//1 |
按位或 |
OR(|) |
var result=25 | 3;alert(result);//27 |
按位异或 |
XOR(^) |
var result=25 ^ 3;alert(result);//26 |
左移 |
<< |
var oldValue=2;var newValue=oldValue << 5;//64 |
有符号的右移 |
>> |
var oldValue=64;var newValue=oldValue >> 5;//2 |
无符号的右移 |
>>> |
var oldValue=-64;var newValue=oldValue >>> 5;//134217726 |
布尔操作符 |
|
|
逻辑非 |
! |
alert(!false);//true |
逻辑与 |
&& |
var result=true && false;//false |
逻辑或 |
|| |
var found=true;var result=(found || someUndefinedVariable);//true |
七、相等操作符
ECMAScript中的相等操作符由两个等于号(==)表示,不等操作符右叹号后跟等于号(!=)表示。
在转换不同的数据类型时,相等和不相等操作符遵循下列基本规则:
-
如果有一个操作数是布尔值,则在比较相等性之前先将其转换为数值——false转换为0,而true转换为1;
-
如果一个操作数是字符串,另一个操作数是数值,在比较相等性之前先将字符串转为数值;
-
如果一个操作数是对象,另一个操作数不是,则调用对象的valueOf()方法,用得到的基本类型值按照前面的规则进行比较;
这两个操作符在进行比较时则要遵循下列规则。
-
null和undefined是相等的。
-
要比较相等性之前,不能将null和undefined转换成其他任何值。
-
如果有一个操作数是NaN,则相等操作符返回false,而不相等操作符返回true。重要提示:即使两个操作数都是NaN,结果不变。
-
如果两个操作数都是对象,则比较他们是不是同一个对象。如果两个操作数都指向同一个对象,则相等操作符返回true;否则,返回false。
除了在比较之前不转换操作数之外,全等和不全等操作符与相等和不相等操作符没有什么区别。全等操作符(===),不全等操作符(!==)。
由于相等和不相等操作符存在类型转换问题,而为了保持代码中数据类型的完整性,推荐使用全等和不全等操作符。
八、语句
语句 |
语法 |
if语句 |
if (condition) statement1 else statement2 |
do-while语句 |
do { |
while语句 |
while(expression) statement |
for语句 |
for (initialization; expression; post-loop-expression) statement |
for-in语句 |
for (property in expression) statement |
label语句 |
label:statement |
break和continue语句 |
break语句会立即退出循环,强制继续执行循环后面的语句。而continue语句虽然也是立即退出循环,但退出循环后会从循环的顶部继续执行 |
with语句 |
with语句的作用是将代码的作用域设置到一个特定的对象中。with (expression) statement; |
switch语句 |
switch (expression) { |
九、函数
(一) 、参数
ECMAScript 函数的参数与大多数其他语言中函数的参数有所不同。 ECMAScript 函数不介意传递进来多少个参数,也不在乎传进来参数是什么数据类型。也就是说,即便你定义的函数只接收两个参数,在调用这个函数时也未必一定要传递两个参数。可以传递一个、三个甚至不传递参数,而解析器永远不会有什么怨言。之所以会这样,原因是 ECMAScript 中的参数在内部是用一个数组来表示的。函数接收到的始终都是这个数组,而不关心数组中包含哪些参数(如果有参数的话)。如果这个数组中不包含任何元素,无所谓;如果包含多个元素,也没有问题。实际上,在函数体内可以通过 arguments 对象来访问这个参数数组,从而获取传递给函数的每一个参数。
其实, arguments 对象只是与数组类似(它并不是 Array 的实例),因为可以使用方括号语法访问它的每一个元素(即第一个元素是 arguments[0],第二个元素是 argumetns[1],以此类推),使用 length 属性来确定传递进来多少个参数。
(二)、 返回值
有时,我们会希望函数将值返回调用它的地方。通过使用 return 语句就可以实现。在使用 return 语句时,函数会停止执行,并返回指定的值。
语法
function myFunction() { var x=5;
return x; }
上面的函数会返回值 5。
注释:整个 JavaScript 并不会停止执行,仅仅是函数。JavaScript 将继续执行代码,从调用函数的地方。函数调用将被返回值取代:
var myVar=myFunction();
myVar 变量的值是 5,也就是函数 "myFunction()" 所返回的值。
即使不把它保存为变量,您也可以使用返回值:
document.getElementById("demo").innerHTML=myFunction();
"demo" 元素的 innerHTML 将成为 5,也就是函数 "myFunction()" 所返回的值。
您可以使返回值基于传递到函数中的参数:
(三)、实例
计算两个数字的乘积,并返回结果:
function myFunction(a,b) { return a*b; } document.getElementById("demo").innerHTML=myFunction(4,3); "demo" 元素的 innerHTML 将是:5
参考资料《JavaScript高级程序设计》