征服 ajax, javascript 面向对象思想设计


Javascript 面向对象的程序设计

一:用定义函数的方式定义类
function class1(){
    类成员的定义及构造函数
}
这里的class1 既是一个函数也是一个类。作为函数,它可以理解为类的构造函数,负责初始化的工作。

二:使用new 操作符获得一个类的实例
new Date() 表示创建一个日期对象,而Date 就是表示日期的类,只是这个类是由javascript 内部提供的,
不是用户定义的。
new 操作符不仅对内部类有效,对用户定义的类也是同样的用法,对于自定义的class1
也可以用 new 来获取一个实例:
 var obj1=new class1();
抛开类的概念,class1 就是一个函数,那么是不是所有的函数都可以用new 来操作呢 ?答案是肯定的,
在javascript 中,函数和类就是一个概念,当new 一个函数时,就回返回一个对象。如果这个函数中没有
初始化类成员,就会返回一个空的对象。
事实上,new 一个函数的时候,这个函数就是所代表类的构造函数,其中所有的代码都可以看作是为了初始化
一个对象而工作。

三:使用方括号[] 引用对象的属性和方法
在 javascript 中,【每个对象可以看作是多个属性(方法)的结合】,引用一个属性方法很简单,即
对象名. 属性(方法)名
除此之外还可以用方括号的形式来引用:
对象名["属性(方法)名"],这里的方法名和属性名是一个字符串,而非先点号后面的表示符
var arr=new Array();
         arr[0]="3333333";
         arr[2]="4444444";
         alert(arr.length);             3
         alert(arr["length"]);          3
        
         arr.push("ddddd");
         arr["push"]("eeeee");
         alert(arr.length);             5

访问类的方法: 类名["属性名称"]  或者  类名. 属性名称
 function User()
     {
        this.age=21;
        this.name="军";
     }
     function vad(o)
     {
        var user=new User();
        if(o.selectedIndex!=0)
        {
           alert(user[o.value]);
        }
     }
四.动态添加修改删除属性和方法
首先使用Object来创建一个空对象user; var user=new Object();
1.添加属性 user.name="dddddddd";
2.添加方法 user.alert=function(){alert("dddddd")};
3.修改属性
用新的属性替换旧的属性。
4,删除属性
删除属性的过程也很简单,就是将其设置为
undefined;
5.删除方法
 同样设置为 undefined
使用这种方法还有一个 额外的特点,就是可以使用非标识符字符串作为属性名称,例如标识符中不允许
已数字开头或者出现空格,但是在方括号([])语法中却可以使用;

六:使用大括号{}语法创建无类型对象
 javascript 中的对象其实就是属性(方法)的结合,并没有严格意义上类 的概念 ,所以他提供了另外一种
简单的方式来创建对象。
  var  u={
        
            name:'jasc',
            age:'21',
            hello: function(){alert('ddddddddeee');},

            sex:'难',
            "001":"ggggg"          ------无类型对象
         };       
        
         alert(u.age);
         u.hello();
         alert(u.sex);        
         alert(u["001"]);

七:prototype  原型对象
 每个函数对象都具有一个子对象 prototype,prototype 表示了函数的原型,而函数也既是类,prototype
实际上就表示了一个类的集合。 当通过 new 来获取一个类的对象时,prototype 对象成员都会成为实例化
对象的成员。

 class1.prototype.method=function(){alert("dddddddddd");};    

         
          var cls=new class1();
          cls.method();

深入认识 javascript 中的函数
 函数作为一个对象,他本身就可以具有一些方法和属性,而为函数添加属性和方法就必须借助于function 这个
类型

 var i=function(a,b){alert(a);};
           
            i(5);
函数对象和其他类部对象之间的关系。


====================================================================================
使用面向对象思想处理 cookie
1. 创建Cookie对象
因为是作为类名或者命名空间的作用,所以和Math对象类似,这里使用Cookie来表示该对象。
var Cookie=new Object();
2.实现设置Cookie的方法,其中name是要设置cookie的名称;value是设置cookie的值,option包括了其他
选项,是一个对象作为参数。
/*使用面向对象的思想处理Cookie*/
           
            /*如果 Cookie已存在,添加此Cookie,就相当于修改此Cookie*/
           
            var  Cookie=new Object();
            Cookie.setCookie=function(name,value,option)
            {
                 //用于存储赋值给Document.cookie 的字符串
                 var str=name+"="+escape(value);
                 if(option)
                 {
                    //如果设置了过期时间
                    if(option.expireDays)
                    {
                        var date=new Date();
                        var ms=option.expireDays*24*60*60*1000;
                        date.setTime(date.getTime()+ms);
                        str+=";expires="+date.toGMTString();
                       
                    }
                    if(option.path)
                       str+=";path="+path;
                    if(option.domain)
                       str+=";doman="+domain;
                    if(option.secure)
                       str+=";true";
                 }
                 document.cookie=str;
            }
            Cookie.getCookie=function(name)
            {
                var cookieArray=document.cookie.split(";");
                for(var i=0;j=cookieArray.length;i<j;i++)
                {
                    var arr=cookieArray[i].split("=");
                    if(arr[0]==name)
                      return unescape(arr[1]);
                }
                return  "";
            } 
            Cookie.deleteCookie=function(name)
            {
                 this.setCookie(name,"",{expireDays:-1});
            }
            var Cookie={
              setCookie=function(){},
              getCookie=function(){},
              deleteCookie=function(){}
            };       
           
           
       }
====================================================================================
JavaScript 高级编程
 框架编程 . cookie 技术 .正则表达式 .window 对象 .异常处理

一:框架编程包括框架的自我控制以及框架之间的互相访问,例如从框架中引用另外一个框架中的
JavaScript 变量,调用其他框架内的函数,控制另外一个框架的表单行为等。

一个页面中的所有框架以集合形式作为Windows对象的属性提供;
例如;window.frames表示的就是页面内所有的框架的结合,这和表单对象,链接对象,图片对象等是
类似的,不同的是,这些集合是document的属性。

要引用一个框架,可以使用如下语法:
window.frames["frameName"]
window.frames.framesName
window.frames[index]

其中 ,windows字样也可以用 self 代替或省略,假设 frameName为页面中的第一个框架,则以下写法
是等价的:
self.frames["frameName"]
self.frames[0]
frames[0]
frameName

所谓对框架的引用也就是对window对象的引用,例如使用 window.document 对象象页面写入数据,使用
window.locaiton属性来改变框架内的页面等。

1,从父框架到子框架的引用
 window.frames["frameName"] 引用页面内为 frameName 的子框架
 如果要引用页面内子框架的子框架,window.frames["frameName1"].frames["frameName2"]

2. 子框架到父框架的引用
每一个window对象都有一个 parement属性,表示他的父框架,如果该框架已经是顶层框架,
则 window.parent 还表示框架本身。

3.兄弟框架间的引用
 如果两个框架同为一个框架的子框架,可以通过父框架来间接引用。
 self.parent.frames["frame2"]

4.不同层此框架之间的互相引用
  通过 1 和 3 的方法可以实现

5.对顶层框架的引用
 和parent 属性类似,window对象还有一个top属性 他表示对顶层框架的引用,这可以用来判断一个
框架自身是否为顶层框架。
 if(self==top){}

对框架的引用就是对window对象的引用,利用windows对象location属性,可以改变框架的导航
 window.frames[0].location=1.html

引用其他框架内的javascript 变量和函数


js 全屏
<script   language="javascript">   
              if   (this.name!='FullWnd')   
                      {                           
                                  window.open(location.href,'FullWnd','fullscreen,scrollbars=no');     
                                  this.parent.opener=null;   
                                  this.parent.close();   
                   } 
  </script>

正则表达式
使用 RegExp 对象执行字符串匹配
RegExp 是 JavaScript 中的正则表达式对象,利用它可以完成
字符串匹配的各种操作。。 
 var objRegExp=/pattern*/[flag];
 var objRegExp=new RegExp("pattern"[,"flag"]);
pattern 要匹配的模式,flag表示搜索模式,有2个可选参数
g,i, g表示全局搜索,i表示忽略大小写,默认情况下是
大小写敏感,
 //这种以/开始和/结尾的字符序列称为正则表达式。
            /*→正则表达式函数 与 C# 里面的用法区别还蛮大的。
         RegExp JavaScirpt 中的正则表达式对象,利用它可以完成字符串的匹配的各种操作
             var objRegExp=/regularExpression/[g|i]
             var objRegExp=new RegExp(/regularExpression/[g|i]);
        
         说明 :g|i 可选,g 表示全局搜索,i 表示忽略大小写, 在Replace 方法中非常有用
            
         →方法:
         exec(str) 返回数组
         test(str) 返回bool 值
        
         →静态属性: 最好不要用(被他搞晕了)
         RegExp.input 保存被--搜索---的字符串
         RegExp.index 保存匹配的首字符的位置(0开始)
         RegExp.lastindex 保存匹配字符串的下一个字符的位置
         RegExp.lastMatch 保存匹配到的字符串(包括括号外面)
         RegExp.lastParen 保存最后一个匹配的字符串 (最后一个括号的内容)
         RegExp.leftContext  保存匹配字符串左边的内容
         RegExp.rightContext 保存匹配字符串右边的内容
        
         RegExp.$1~$9 保存最开始的9个匹配项(括号中的内容)

        
         →提取字符串
        
         字符串.search(regularExpression)  返回第一个字符的索引位置,否则返回 -1,和index 功能相似
         字符串.replace(regularExpression,replaceString) 返回一个新的字符串,常用就是删除html标记
         字符串.match(regularExpression)   返回一个数组,和RegExp 功能相似
        
         注意:hrefurl=$("#TextArea1").html()+ alert(hrefurl);打印出来的字符串,html标记都被替换掉了,奇迹
         hrefurl=$("#TextArea1").html() +regExp=/href=(.*)><b>(\w+)<\/b>/;+regExp.exec(hrefurl); 
         +hrefstr="RegExp.input:"+RegExp.input;   ==得到竟然是 #TextArea1
      
       */        
//          hrefurl=$("#TextArea1").val();      
//         
//          regExp=/a+?/g;
//         
////        var arr=hrefurl.match(regExp);      
////        alert(arr[5]);  
//          arr=regExp.exec(hrefurl);         
//          hrefbool=regExp.test(hrefurl);       
//     
//          alert(RegExp.lastIndex);













































你可能感兴趣的:(JavaScript)