javascript 学习
javascript 大体上可分为3个不同部分组成： 核心（ECMAscript）,文本对象(DOM),浏览器对象(BOM)
-
核心（ECMAscript）： 关键字，语句，运算符，对象
-
文本对象(DOM)：DOM将把整个页面规划成由节点层级构成的文档.
-
解析遵循 W3C html dom 标准：
-
W3C dom 参考特别关注 DOM Node 说明
-
BOM 浏览器对象. cookie,弹出新浏览器，浏览器设置大小
核心（ECMAscript）Global 内置对象；
方法： parseInt(),isNan(),encodeURI()...等都为此对象方法
特别注意 eval();动态语言的象征 比如：eval("alert('hi')"); 但这个方法很邪恶（安全方面）
文本对象(DOM)说明：
<bookstore>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
</bookstore> | 
| 
|
1. ECMAscript基础
$ 变量弱类型 ; 匈牙利类型标示 : var iOuouValue=100;
$ 结束行分号有无都可以; 但再 onsubmit="javascript:function();return false;"
$ 关键字 ; 提别注意
"constructor" bean.constructor
//print bean function(){
....
}
"typeof" var test=1; alert(typeof testX); //output "undefined"
"NaN" - not a number -> isNan("blue"); //output "true" ->isNan("123"); //output "false"
$ 对象; var o = new Object(); var a = {}
这里特别说明下 我们普通写的 一个 function 就是一个 object
这 var a = {name:"刘凯毅"} 等同与 var a = function(){this.name="刘凯毅"};
来个 {name:"test",pass:"123456",addr:"bj"} //这是什么 ？！ json
当 var str = '{name:"test",pass:"123456",addr:"bj"}'
var objectBean = eval(str); //这里就是 对象 objectBea.name 使用了
域概念：
<SCRIPT type=text/javascript>
var sMessage = 'Hello';
function setSomething() {
sColor = 'red';
sMessage = 'Hello World!';
}
setSomething();
alert(sMessage); //Hello World!
alert(sColor); //red
</SCRIPT> | <SCRIPT type=text/javascript>
var sMessage = 'Hello';
function setSomething() {
var sColor = 'red';
sMessage = 'Hello World!';
}
setSomething();
alert(sMessage); //Hello World!
alert(sColor); // 什么都没有
</SCRIPT>
| <SCRIPT type=text/javascript>
var sMessage = 'Hello';
function setSomething() {
var sColor = 'red';
var sMessage = 'Hello World!';
}
setSomething();
alert(sMessage); //Hello
alert(sColor); // 什么都没有
</SCRIPT>
|
为面向对象做基础：object prototype 类型的对象应用。参考
// 最简单的 继承
Object.prototype.inObj = 1;
function A()
{
this.inA = 2;
}
A.prototype.inAProto = 3;
B.prototype = new A; // Hook up A into B's prototype chain
B.prototype.constructor = B;
function B()
{
this.inB = 4;
}
B.prototype.inBProto = 5;
x = new B;
document.write(x.inObj + ', ' + x.inA + ', ' + x.inAProto + ', ' + x.inB + ', ' + x.inBProto);
//1, 2, 3, 4, 5
//增加点信心 http://www.json.org/json.js
Object.prototype.toJSONString = function (filter) {
return JSON.stringify(this, filter);
};
后我们就可以使用 bean.toJSONString()不是吗？
|
$ arguments ;
function getFun(){alert(arguments.length);} ;
getFun("xx") //output 1
getFun("xx",23) //output 2
$ 语句 ;特殊说明下 for
for(var i=0i<iCount;i++) 或 for( attr in object ) ;
如果无聊 你可以 for( sProp in window ){alert(sProp+"你丫点啊！");} //看看 javascript 的反射
面向对象：
var bean = new Bean();
1.工厂方法
function getAttr(){
alert(this.attr)
}
function Bean(tattr){
var bean = new Object;
bean.attr = tattr;
bean.getAttr = getAttr;
return bean ;
}
根本就是山寨版 面向对象
2.构造
function Bean(tattr){
this.attr = tattr ;
bean.getAttr = function(){
alert(this.attr);
}
}
其上 2 总 再Bean 对象创建时，方法会 “重复生成函数”！
3.原型模式
function Bean(){}
Bean.prototype.attr = "";
Bean.prototype.getAttr=function(){alert(this.attr);}
解决 “重复生成函数” 问题，但新的问题 Bean.prototype.getArray = new Array();
其 new 对象 bean1 和 bean2 都会共享 new Array 空间(是我们不想看到的)
4.混合 模型 :) 哈哈
function Bean(){
this.attr= "";
this.getArray=new Array;
}
Bean.prototype.getAttr=function(){alert(this.attr);}
5.动态原型 （注意下面开始，就是真正的面向对象！！！）
function Bean(){
this.attr= "";
this.getArray=new Array;
//classload 加载 时
if(typeof Bean._initialized == "undefined" ){
Bean.prototype.getAttr=function(){alert(this.attr);};
Bean._initialized= true ;
}
}
/****************************************************************/
对象继承
1.对象冒充！！(可支持多继承，山寨很强大)
function classA(sstr){
this.color = sstr ;
this.sayColor = function(){
alert(this.color);
};
}
function classC(){}
function classB(){
this.newMethod =ClassA ;
this.newMethod();
delete this.newMethod ;
this.newMethod =ClassC ;
this.newMethod();
delete this.newMethod ;
this.arrt = "google";
}
2.call() apply() 也山寨,
function classA(sstr){
this.color = sstr ;
this.sayColor = function(str){
alert(str+this.color);
};
}
function classB(){
// this.newMethod =ClassA ;
// this.newMethod();
// delete this.newMethod ;
classA.call(this,"red");
//classA.apply(this,new Array("red"))
this.arrt = "baidu";
}
3.正统的继承 原型链 (但不支持多继承)
function classA(){this.oo="test";}
classA.prototype.color = "red";
function classB(){}
classB.prototype = new classA ;
classB.prototype.sayName = function(){
alert( this.color );
}
var bb = new classB ;
bb.sayName(); // output red
alert(bb.oo); // output test
alert( bb instanceof classA); //output true
alert( bb instanceof classB); //output true4.如果你要多继承！！并且还支持 instanceof
混合方式：
function classA(){}
function classB(){}
function classC(){
classA.call(this);
classC.call(this);
}
classC.prototype = new classA ;//注意 这 instanceof 只能对 A有用