ppk on javascript 笔记(五)

第5章 核心

1999年ECMA将核心标准化为ecmascript(http://www.ecma-international.org/publications/standards/Ecma-262.htm),对该规范最重要的评论来自Douglas Crockford(http://crockford.com/javascript/recommend.html)关于Crockford更多的文章可参考(http://dancewithnet.com/2009/03/29/douglas-crockford/

基础知识

区分大小写

语句和分号:分号表示一条语句结束;对于一行代码的语句,不管是否以分号结尾,javascript会自动插入分号;当使用if,for或while控制结构时,可以不用分号结束。

注释

代码块:{};当if, while, for只包含一条语句时,可以省略{};函数主体必须在{}中。

运算符:优先级;返回值;赋值运算符返回当前的值,因此可以使用var a=b=1;

值:函数也可以用来赋值(注意使用为值时不应该再带括号)。

数据类型

javascript有4种重要的数据类型:数字、字符串、布尔型和对象;4种小数据类型:undefined、null以及表示“不存在”的两种说法。

null意味着无值,下面不会报错,显示为null,但当我们使用null值时就会报错--缺少对象。

var x = document.getElementById('test');
alert(x);

undefined发生在3种情况:声明了一个变量,但没有赋值;访问一个对象尚未声明的属性;定义了函数的参数,但没有传值给它。

alert(y);
var x; alert(x);
alert(window.y);

第一条语句会报错:y未定义;第二行和第三行则会显示undefined。

typeof运算符表示一个值的数据类型,它有两个特例:

var x =1; alert(typeof x);
var y ='1'; alert(typeof y);
var z =true; alert(typeof z);
function f() {}
alert(
typeof(f));
alert(
typeof(null));

第一行返回number,第二行返回string,第三行返回boolean。 

函数使用typeof时返回function,null则返回object。

数据类型转换:javascript会根据需要将一种类型解释为另一种类型,原类型并没有改变。如:

var a = 2;
var b ='3';
var c = a * b;

a是一个数字,b是一个字符串,在做乘法运算时,将b解释为数字,结果c是一个数字,值为6,b并没有改变,仍是一个字符串。

上面的alert(x),实际上也是把null解释为字符串,然后输出。

当字符串不能被解释为数字时,返回NaN.

使用+时,总是解释为连接,而不是加法运算。

转换为布尔型时,null, undefine, 数字0, NaN, 空字符串''被转换为false,其他所有的值被转换为true。

显式的数据类型转换,如:x1或者-0将字符串转换成数字,+''将转换成字符串,使用!!转换成布尔型。

普通运算符

* - / %及*=等,++和--同样区分前后,=赋值运算符返回被赋予的值,==相等运算符,===等同运算符要求数据类型一致,同样!==不等同运算符也针对数据类型。

比较运算符总是先将变量解释为数字进行比较,若有一个不能解释为数字,则按照第一个字母顺序进行比较,后面的大于前面的,小写的大于大写的(类似ascii)

条件运算符?:

变量

变量命名习惯采用低驼峰命名规则(lowerCamelCase),W3CDOM也如此命名,命名时不要使用保留字。

允许对一个未声明的变量直接赋值,这个变量会自动声明,但不允许直接使用未声明的变量,最好使用var显示声明以保持代码清晰。

按作用域分为全局变量和局部变量,没有块作用域,当在函数体中用var显式声明或作为函数的参数时为局部变量,其他情况如在函数体内未用var声明而直接使用或在函数体外声明的都是全局变量,尽量使用局部变量。

处理数字

不区分整数和浮点数,在使用浮点数时会产生舍入误差的bug,因此浮点数运算的结果在显示之前要先进行舍入。0.5可以简写为.5s

以0开头的数字为8进制,以0x开头的数字为16进制。

Math对象:

取整的三种方法:Math.round(), Math.floor(), Math.ceil(),同样适用于负数;

Math.random()用于产生0~1的随机数;

Math.abs()取绝对值。

n.toFixed(2)将数字n转换成一个拥有固定位数的字符串,要求n必须为number类型,否则会报错;它返回字符串。

全局方法parseInt(x)和parseFloat(x)将字符串转换为数字,它逐字符检查字符串,直接遇见非数字字符为止,当第一个字符非数字时才返回NaN,而上面的显式转换则要求字符串必须全部为数字,(注意16进制的x和float的.也是允许的)。

与字符串打交道

习惯上适用单引号表示字符串,允许使用双引号,\为转义符,+为连接符。

x.length用于取字符串的长度,这是字符串对象的一个属性,且是只读的。

x.indexOf('a')和x.lastIndexOf('a')用于检索,它返回的索引从0开始,未检索到时返回-1,可以指定检索开始的位置,如x.indexOf('a', 2), x.lastIndexOf('a', x.length-1)。

x.charAt(9)返回指定位置的字符,索引从0开始。

x.substring(9)或x.substring(9, 11)返回开始位置和结束位置之间的字符串,索引从0开始。

x.split('c')用指定的分隔符将字符串转换为数组,分隔符本身并不出现。

x.toLowerCase()和x.toUpperCase()用于大小写转换。

处理布尔值

布尔型数据只有两个:true和false。

逻辑运算符|| && !,注意javascript也包含逐位运算符&和|。

if(!document.styleSheets)对象检测时,若浏览器不支持这种方法,即为一个不存在的对象null,它被转换为false。

逻辑运算符||和&&并不返回布尔值,而是返回运算中最后一次计算的表达式的值。

例如,应用这个方法,我们可以使用来取得事件目标

var evtTarget = evt.target || evt.srcElemnt;

大多数的浏览器将事件目标保存在evt.target中,而IE保存在srcElement中,当evt.target非null时,则返回,否则继续计算srcElement。&&用法也如此。

控制结构

if ... else if ... else ...

switch(...) { case ..: .. break; default:... } 注意,switch允许任意的数据类型(其他语言如java只允许对数字),但switch与case比较时,不会进行数据类型的转换。

四种循环语句:for, while, do/while, for in

for, while 条件检测总在循环体执行之前,而do/while先执行后检测。

当while陷入无限循环时,浏览器会提示是否终止代码运行。

do { ...} while(..); 最好在do/while的最后加一个分号。

break与continue。

当在嵌套循环中想跳出外层循环时,使用标签是可行的,事实上,任何语句都可以标志为标签。

myloop:for(var i=0; i<x.length; i++) {
for(var j=0; j<x.length; j++) {
if([something is the case]) continue myloop;
}
}

try/catch用来确保用户不会看到错误信息。

函数

定义一个函数 function f() {} 或 var f = function() {}。

函数可以直接return;或return任意一个数据类型。

var g=f; 则定义了函数的一个引用,可以运行g();。

当将函数作为一个值时不能使用(),而()运算符则命令函数执行。

函数可以内嵌函数,使用内嵌函数时,需注意局部变量的作用域:

function init() {
var message =' clicked ';
var x = document.getElementsByTagName('a');
for (var i=0; i<x.length; i++) {
x[i].onclick
=function() {
x[i].firstChild.nodeValue
= message;
}
}
}

函数运行在被定义的作用域中,而不是执行它们的作用域中。这意味着内嵌函数可以访问所有它的父函数的局部变量,即使父函数在内嵌函数调用前就早已执行。

在此,内嵌函数访问了父函数的局部变量i和x,但是i发生了错误,程序报错。这是因为内嵌函数只能访问到局部变量的最终值;

假设x.length=9,那么init函数执行结束后i的值为10,以后当内嵌函数触发时就会使用这个i,于是使用了x[10]这个null值,从而报错;

正确的写法应该是 x[i].onclick = function() { this.firstchild.nodeValue = message; }

对象

对象用来保存彼此相关联的变量和函数,也就是一组属性的集合,值为函数的属性称作方法,点运算符用来获取一个属性或方法。

允许自定义对象 var t = new Object(); t.a = 1; t.b = function() {}

可以用字面量来定义对象 var t = { a:1, b:fucntion() {} }属性间用逗号隔开。

访问一个属性没有什么害处,不管对象是否有这个属性,但是访问一个方法的同时也尝试去执行它,例如

function stopProp(e) {
if(e.stopPropagation) {
e.stopPropagation();
}
e.cancelBubble
=true;
}

对停止事件传播,W3C标准的浏览器需执行stopPropagation方法,而IE只需将cancelBubble设为true,上面这种写法是规范的,直接访问不存在的方法会报错,而对于W3C标准的浏览器则只是多创建一个值为true的属性而已,但是这个属性对IE来说却是一个预定义属性,改变预定义属性的值便会引起一些相应的动作。

允许创建自己的属性。

this关键字出现在方法中(js不区分方法和函数),用来引用定义该方法的对象。

属性和变量也是对等不区分的,全局变量也即全局对象window的属性。

关联数组

下面两种表达式等价的:object.property; object['property']; 同样的这也是等价的:object.method(); object['method']();

使用点符号时,后面的属性名或方法名是固定的字符串常量,而使用方括号则可以使用变量随意更改属性的名字。

关联数组是一个数组,它允许通过字符串作为值的名字来找到某一个确定的值,这些字符串叫做关键字。

for in用来遍历一个关联数组,例如

var t = {
a:
2,
b:
'2',
c:
function() {
alert(
this.a*this.b);
}
}
for(var i in t) {
alert(i
+':'+ t[i]);
}

弹出的三个信息分别为a:2,b:2和c:fuction() { alert(this.a*this.b); }。注意到i表示了关键字,而方括号使用了变量i来获取t的属性(点符号是行不通的,t.i表示t的i属性),同时也可以看到a的值数字2被转换成了字符串2。

数组

数组是一个用数字来索引的值的集合,索引数从0开始,例如

var t =new Array();
t[
0] ='2';
t[
2] =3;
t[
5] =function() {
alert(
this[0] *this[2]);
}
t[7] = new Array();
t[7][5] = false;
t[
5]();
alert(t[
1]);

这定义了一个稀疏数组,它只定义了几个元素,对于其他元素根本就没有创建它们,访问时会返回undefined,就好像一个未定义的属性一样。运行t[5]()会弹出6。t[7]则是一个嵌套数组。

除了上述定义方法,数组还有两种表示法:

var s =new Array(0, 1, '2', 'three', false);
var t = [0, 1, '2', 'three', false];

这两种方法无法指定特定的索引序列,其中后一种方法数组字面量常用。

如getElementsByTagName获得的节点列表并不是数组,可以看做为缺乏所有定义在数组对象上的有用方法的只读数组,以后再介绍。

length属性表示数组长度,数组长度总是最大的索引数加1,包括稀疏数组。增加减少元素会更新length的值,对length属性赋值会改变数组,访问超出长度的索引会返回undefined。

设t是一个数组,有四种方法增减元素:t.unshift(x);用来插入一个起始元素,t.shift();删除一个起始元素,t.push(x)插入一个末尾元素,t.pop()删除一个末尾元素。

原文地址:https://www.cnblogs.com/bloodmage/p/1758573.html