JavaScript语法参考

 

=================================================================

Javascript 动画框架

http://madrobby.github.com/scriptaculous/

CSS3 和 JavaScript 特效

 

=================================================================

新浪微博的XSS攻击的JS代码

=================================================================

The 11 JavaScript Mistakes you’re Making

=================================================================

关于JavaScript的单线程模型

=================================================================

JS实现 File Download

=================================================================

JavaScript Equality (==) and Identity (===)

=================================================================

JavaScript原型和继承a special example by jfoJavascript的构造函数和constructor属性

=================================================================

jQuery中Deferred的实现原理

=================================================================

关于new function(…)初始化

function f()
{
this.v = 0;
}
var a = new f();
alert(a.v);
alert(a.length);
输出:
0
undefined

function f()
{
this.v = 0;
return new Array(“j”, “f”, “o”);
}
var a = new f();
alert(a.v);
alert(a.length);
alert(a[0]);
输出:
undefined
3
j

说明创建一个object时,该function的return语句将覆盖new新创建的对象。

function很特殊,它可以作为函数直接被调用;也可以用作创建新的object(通过new function(…)),此时
function的函数体则扮演了构造函数的角色。

看看jquery(v1.3.2)
(function(){
var jQuery = window.jQuery = window.$ = function( selector, context ) {
// The jQuery object is actually just the init constructor ‘enhanced’
return new jQuery.fn.init( selector, context );
},
jQuery.fn = jQuery.prototype = {
init: function( selector, context ) {

}
};
jQuery.fn.init.prototype = jQuery.fn;

})();
$(“body”):以函数调用的形式创建新对象(return new jQuery.fn.init( selector, context );
var J = new jQuery(“body”):以new function(…)的形式创建新对象,return返回的对象覆盖new的对象
两者最终返回的完全一样。

=================================================================
function的类静态变量(Instance Property、Class Property、Prototype Property)

实例对象访问不到function(类似于C++中的class)中的所谓静态变量

function f()
{
f.v_class = 1;
this.v_object = 0;
}
var a = new f();
alert(a.v_class);
alert(a.v_object);
输出:
undefined
0

typeof(f)将输出function,可以将f看做一个特殊的object,那么f.v_class = 1就是给 f 这个object添加
一个属性,a自然不可以访问到 f 的属性,这样解释了为什么a.v_class是undefined,从这一点看,
静态变量没什么特殊之处,仅仅为function object的普通属性而已。
另外由于每次调用f()这个函数,涉及到都是同一个对象f,f属性的变化是可积累的,于是表现形式
和C++中的静态变量一样。

new的过程可以看做先分配一块内存空间赋给this,然后调用f()完成初始化(f()相当于构造函数),
在f()函数体内执行正常的JavaScript语句流程,碰到this替换为当前对象的地址,再对相应字段赋值;
碰到f.property对 f 这个”对象”的property属性进行操作;并无特殊之处。

另外,如果直接调用f()函数,则this将变成全局的那个this,在浏览器中为window对象。

ps:通过prototype访问
function f()
{
this.v_object = 0;
}
f.v_prototype = 1;
var a = new f();
alert(a.v_prototype);
alert(a.v_object);
输出:
1
0

=================================================================
Array类型——function object

Array、Number、String、Date、Function等类型,可以进行如下操作

var T = Array;
var a = new T(“1111”, “222”, “33”);
alert(a);
alert(a.length);

T = String;
a = new T(“1111”, “222”, “33”);
alert(a);
alert(a.length);
输出:
1111,222,33
3
1111
4

Array等可以用function Array() {…}的形式定义,看作function object,可被赋值,正如可以进行一下操作一样:
var func = function() { alert(“Hello”); }
func();

=================================================================
Enumerating Properties

for (var prop in document)
document.write(‘document[“‘ + prop + ‘“] = ‘ + document[prop] + ‘<br /> ‘);
输出:
document[“addEventListener”] = function addEventListener() { [native code] }
document[“evaluate”] = function evaluate() { [native code] }
document[“createExpression”] = function createExpression() { [native code] }
document[“createNSResolver”] = function createNSResolver() { [native code] }
document[“baseURI”] = file:///E:/work/Cygwin/home/Administrator/sh_script/js/js_template.html
document[“textContent”] = null
document[“nodeType”] = 9
document[“localName”] = null

=================================================================
Objects Are Reference Types

var str1 = “abc”;
var str2 = “abc”;
alert(str1 == str2);
===>true

var str1 = new String(“abc”);
var str2 = new String(“abc”);
alert(str1 == str2);
===> false [the == operator checks whether the two variables refer to the exact same object]

var n1 = Number(314);
var n2 = Number(314);
alert(n2.valueOf() == n1.valueOf());
===>true

The relational comparison operators (>>,<<,>>=, and<<=) work as you would expect for objects for which these operators make sense (e.g., , , , and so on). The reason is that these operators automatically convert their operands to a primitive type.The equality relational operator doesn’t do this because you might actually want to compare references.

=================================================================
Prototype-Based Objects

Java and C++ are class-basedobject-oriented languages. An object’s properties are defined by its class—a description of the code and data that each object of that class contains. In these languages, a class is defined at compile-time, that is, by the source code the programmer writes. You can’t add new properties and methods to a class at runtime, and a program can’t create new data types while it’s running.

Because JavaScript is interpreted (and therefore has no visible distinction between compile-time and runtime), a more dynamic approach is called for. JavaScript doesn’t have a formal notion of a class; instead, you create new types of objects on the fly, and you can modify the properties of existing objects whenever you please.

JavaScript is a prototype-basedobject-oriented language, meaning that every object has a prototype, an object from which it inherits properties and methods. When a property of an object is accessed or a method invoked, the interpreter first checks to see if the object has an instance property of the same name. If so, the instance property is used. If not, the interpreter checks the object’s prototype for the appropriate property. In this way the properties and methods common to all objects of that type can be encapsulated in the prototype, and each object can have instance properties representing the specific data for that object.

An object’s prototype is also an object, and can therefore itself have a prototype.

 

Property

Description

prototype

Reference to the object from which it inherits non-instance properties

constructor

Reference to the function object that served as this object’s constructor

toString()

Converts the object into a string (object-dependent behavior)

toLocaleString()

Converts the object into a localized string (object-dependent behavior)

valueOf()

Converts the object into an appropriate primitive type, usually a number

hasOwnProperty(prop)

Returns true if the object has an instance property named prop, false otherwise

isPrototypeOf(obj)

Returns true if the object serves as the prototype of the object obj

propertyIsEnumerable(prop)

Returns true if the property given in the string propwill be enumerated in a for/inloop

Inheritance in JavaScript is achieved through prototypes. It is clear that instances of a particular object “inherit” the code and data present in the constructor’s prototype.