只要能理解对象的行为,引用的处理和作用域的判断,毫无疑问就能改变你编写javaScript的习惯.
基础,开发习惯,高度与测试技巧,DOM脚本编程与事件处理....Ajax.
将发展成什么样子.
相册,自动完成搜索框,完整的Ajax wiki应用...
共四部分:
认识现代JavaScript
专业JavaScript开发
分离式JavaScript
Ajax
JavaScript的未来
p29 p37
要点::
注意第4点..
/
关于方法和变量 的总结(大杂混):
对function User(name,age){
this.names=name; //names为公有变量.
this.getAge=function(){....};//getAge()为特权方法,可以使用私有方法.
var myage=age; 私有变量.//
function isGood(){} 私有方法,只能在构造函数中使用.
}
User.prototype.isBad=function(){..};//公有方法.
User.prototype.sex="男"; //公有变量.
User.cloneUser=function(user){return user;}//静态方法.
对象的创建: 键值要形如: var obj={ key1:value1,key2:value2,....,keyn:valuen};
//也可混着,然后obj.xxx=function(){....};
也可用其它的形式:
形式一:公有
对象的方法通过 prototype 对象添加的例子:
function User(name,age){
this.name=name;
this.age=age;
}
//添加一个新的函数,注意其上下文是实例化后的对象!!!!
User.protype.getName=function(){
return this.name;
};
形式二:私有
只能由构造函数访问私有方法.
私有方法和私有变量只允许 其他的私有方法,私有变量和特权方法访问.
function Classroom(strudents,teacher){
function disp(){
alert(this.names.join(",")); ///????????????????
}
this.students=students;
this.teacher=teacher;
//调用私有方法.
disp();
}
var class=new Classroom(["john","bob"],"Mr.Smith");
//调用disp()会失败.
//class.disp();
形式三:特权方法.
特权方法指代那些能够访问私有变量 同时 允许用户以公共方法 的方式访问的方法.
例:
function User(name,age){
var year=(new Date()).getFullYear()-age;//私有变量.
this.getYearBorn=function(){
return year;
};//特权方法
}
var user=new User("Bob",44);
alert(user.getYearBorn()==1962);
//user.year;不能访问.
形式四:静态方法.
相当于类中的静态方法.
User.clonUser=function(user){
return new User(//这里是其它对象的复制.
user.getName(),
user.getAge()
);
);
function User(name){
this.name=name;
}
//创建该函数的一个新对象.
var me=new User("韩银");
alert(me.constructor==User);
//把它作为一个函数来使用:
User("test");
//因为它的上下文没有指定,所以默认为window对象. //可以类比普通的对象.
alert(window.name="Test");
//下面使用consuctor:
var you=new me.constructor();
alert(me.constructor==you.constructor);
JavaScript中任何代码总有一个 上下文对象(即 代码在该对象内).第7点.
8.面向对象的基础: 对象,创建,方法(公共,私有,特权,静态)
第5点,作用域:JavaScript的作用域问题:
JavaScript里,作用域是由函数划分的,而不是由block划分的(如while,if,for语句中间)的.
所以,即使在一个块中重新命名一个变量,并改变它的值,改变的依然是原来的变量!!
也就是说......变量只在函数作用域内起作用.
另外,变量缺乏声明时,即使是在函数中使用,也被当作全局变量,
也就是说,如果变量没有被显式定义,那么它就是全局变量.
//单引号与又引号的区别:无区别...
var dang =('') 和var dang =''是一样的
var dang =("")和var dang ="" 是一样的
上面之所以一样,就好比你做连加运算,多几个括号没任何问题。
{}是js中Object的简单写法,var dang={}和var dang=new Obejct()一样。
[]是js中Array的简单写法,var dang=[]和var dang=new Array()一样。
//如果定义了而没有赋值,则为null
//如果没有定义,则为 undefined //例如函数有形参,但是使用该函数时没有传递参数.
li[i].οnmοuseοut=function(){
this.style.backgroundColor='white';
}; //语句..
{an:"object"}
["an","object"]
function(){}
new User();
1.数组的定义及赋值....当它在参数时.
var arr=[]; //数组的定义方法.
new Array([new Lecture(1),new Lecture(2),new Lecture(3)]);
new Array(); ?
2.DOM 和 JavaScript 事件的结合,是决定所有现代Web应用程序根本所在.
例 1 :
<head>
<script>
window.οnlοad=function(){
var li=document.getElementsByTagName("li");
for(var i=0;i<li.length;i++){
li[i].οnmοuseοver=function(){
this.style.backgroundColor='blue';
}; //语句..
li[i].οnmοuseοut=function(){
this.style.backgroundColor='white';
}; //语句..
}
};//语句..
</script>
</head>
例 2 :
<script>
window.οnlοad=function(){
var li=document.getElementsByTagName("li");
for(var j=0;j<li.length;j++)
li[j].style.border="1px slide #000";
var every=document.getElementById("every");
every.parentNode.removeChild(every);//~!!!!!!
};
</script>
//对于一个标签:<p class="style" id="everywhere">gooooooooooood</p>
3.语言特性...
一:引用.
例: 多个变量引用同一个对象.
自修改同一个对象......一个引用只能指向一个对象,而不能是另一个引用.
hint:!!!对于字符串 var str="good";
var code=str;
str+="and bad";
//则 str现在指向新的字符串,而code 依然指向"good".
二:函数重载和类型检查.........important.......
重载的条件:判断传入的参数数量 AND 判断传入参数的类型.
JavaScript 每一个函数都有一个参数: argument....它是一个伪数组.不能对其用push(),但是有length.
例1 :
function sendMessage(msg,obj){
if(arguments.length==2)obj.handleMsg(msg);
else alert(msg);
}
//仅一个参数调用
sendMessage("你好,Mr 韩");
//交一个自己写的对象传入...
//然后用用另一套办法显示信息..
sendMessage("你好吗,朋友?",{ //注意这种建立对象的方式...
handleMsg:function(msg){
alert("这是一个客户端的信息: "+msg);
}
}
});
//一个接收任意参数并将其转化为数组的函数.
function makeArray(){
var arr=[]; //数组的定义方法.
for(var i=0;i<arguments.length;i++){
arr.push(arguments[i]);
}
return arr;
}
例2 : //显示错误信息和默认信息. //用 typeof 进行类型检查...
function displayerror(msg){
if(typeof msg=='undefined'){
msg="出现了一个错误!";
}
//显示消息..
alert(msg);
}
//如果定义了而没有赋值,则为null
//如果没有定义,则为 undefined //例如函数有形参,但是使用该函数时没有传递参数.
4.类型检查的方法:
1.用typeof :if(typeof num=="string"){}
2.用javascript都有的一个属性,称为构造函数(constructor).//if(num.constructor==String){///}
// 注意 它们一个为小写,一个有"",一个无.
区别:
变量 typeof 变量 变量.构造函数
{an:"object"} object Object
["an","arrary"] object Array
function(){} function Function
"a string" string String
55 number Number
true boolean Boolean
new User() object User
5.JavaScript的作用域问题:
JavaScript里,作用域是由函数划分的,而不是由block划分的(如while,if,for语句中间)的....
也就是说................................................变量只在函数作用域内起作用.
因此,如果使用过块划分的语言,则对Js某些语言不好理解..
例 1:
var foo="test";
//在if块中.
if(true){//注意,现在还在全局作用域中!!!!
var foo="new test";
}
//现在foo为"new test"
alert(foo==='new test');
//创建一个修改变量foo的函数.
function test(){
var foo="good";
}
//然后调用时,foo只在函数作用域内起作用.
test();
//确认foo还是"new test"
alert(foo=="new test");
所以,即使在一个块中重新命名一个变量,并改变它的值,改变的依然是原来的变量!!
另外,变量缺乏声明时,即使是在函数中使用,也被当作全局变量,也就是说,如果变量没有被显式定义,那么它就是全局变量.
全局变量,实际年也是 window对象的一个节点(属性).
6.闭包:
子函数可以引用包围它的父函数的变量,即使外层函数已经终止!!!!///以后解决!!!
7.上下文对象.
JavaScript中任何代码总有一个 上下文对象(即 代码在该对象内).
上下文对象是通过this 体现的,全局对象其实是 window 对象的属性,故在全局上下文中,this也可指向一个对象.
//例子:p30
................再处理....
8.面向对象的基础: 对象,创建,方法(公共,私有,特权,静态)
创建对象的例子:
var obj=new Object();
obj.val=5;
obj.click=function(){
alert("你好");
};
//下面的与上面的等价: 用{...}简写,结合键值对(key/value pair)来定义属性.
var obj={//用键值对方式来设置属性名和属性值
val:5,
click:function(){alert("你好");}; //引号能不能加上?
};
键值要形如: var obj={ key1:value1,key2:value2,....,keyn:valuen};
9.对象的创建:
JavaScript中没有类的概念.javascript里对象本身可以用来创建新对象,而对象也可以继承自其他对象.
这个概念称为原形化继承....
JavaScript中 任何函数都可以被实例化为一个对象!!!!
例一:
function User(name){
this.name=name;
}
//创建该函数的一个新对象.
var me=new User("韩银");
alert(me.constructor==User);
//把它作为一个函数来使用:
User("test");
//因为它的上下文没有指定,所以默认为window对象. //可以类比普通的对象.
alert(window.name="Test");
//下面使用consuctor:
var you=new me.constructor();
alert(me.constructor==you.constructor);
10.公共方法:
原型(probotype)的属性包含一个对象,这个对象可以作为所有新对象的基引用.
因为对象的原型仍然是对象,和其它对象一样,也可以给它们添加新的属性,结果是每个对象都有这个属性.
//即公有.
例:对象的方法通过 prototype 对象添加的例子:
function User(name,age){
this.name=name;
this.age=age;
}
//添加一个新的函数,注意其上下文是实例化后的对象!!!!
User.protype.getName=function(){
return this.name;
};
11.私有方法.
私有方法和私有变量只允许 其他的私有方法,私有变量和特权方法访问.
只能由构造函数访问私有方法.
例 1:
function Classroom(strudents,teacher){
function disp(){
alert(this.names.join(",")); ///????????????????
}
this.students=students;
this.teacher=teacher;
//调用私有方法.
disp();
}
var class=new Classroom(["john","bob"],"Mr.Smith");
//调用disp()会失败.
//class.disp();
12.特权方法.
特权方法指代那些能够访问私有变量 同时 允许用户以公共方法 的方式访问的方法.
例:
function User(name,age){
var year=(new Date()).getFullYear()-age;//私有变量.
this.getYearBorn=function(){
return year;
};//特权方法
}
var user=new User("Bob",44);
alert(user.getYearBorn()==1962);
//user.year;不能访问.
动态生成方法的例子:p37!!!!!!!!!
13.静态方法.
相当于类中的静态方法.
User.clonUser=function(user){
return new User(//这里是其它对象的复制.
user.getName(),
user.getAge()
);
);
14.关于方法和变量 的总结:
对function User(name,age){
this.names=name; //names为公有变量.
this.getAge=function(){....};//getAge()为特权方法,可以使用私有方法.
var myage=age; 私有变量.//
function isGood(){} 私有方法,只能在构造函数中使用.
}
User.prototype.isBad=function(){..};//公有方法.
User.prototype.sex="男"; //公有变量.
User.cloneUser=function(user){return user;}//静态方法.