论坛首页 → 入门技术论坛 →

用js书写UI组件之js基础知识

浏览 20876 次
锁定老帖子 主题：用js书写UI组件之js基础知识
该帖已经被评为新手帖
作者 正文
  • yunhaifeiwu
  • 等级: 初级会员
  • 性别:
  • 文章: 184
  • 积分: 90
  • 来自: 宁波
   发表时间：2008-12-01   最后修改：2008-12-01
谢谢哥们，让我大开眼界了！

javasript 太灵活强大了！

如果要作为一种数据结构，不可少的是数据元素的插入，修更，访问，删除操作！

关联数组能胜任！ 经验证，空函数也能胜任！不过函数多了一个prototype！还是用关联数组。

歌们中除了函数哪个，其他的两个实质就是关联数组

所有这几个的共性是：
1  插入新元素，与修改元素使用形式一致。如果该元素不存在就新增一个，如果存在了就修改。
2 删除元素用 delete

下面是经过测试的，把函数当map使用的简单例子 
        var fun=function(){};
        fun.aa="aaa";//插入新元素
        fun.aa="aaa1";//修改元素值
        fun.bb="bbb"; //插入新元素
        delete fun.aa;//册除元素
        for(var k in fun){alert(fun[k])};//遍历元素值


附： 我前面出现多个同名key是：运行网页，打开firefox的调试器(firebug),在监控器中
输入 fun.aa="ssss"; fun.aa="dddd"
fun中就有多个key值为aa的元素了！
返回顶楼
          回帖地址
1 请登录后投票
  • achun
  • 等级: 五星会员
  • 性别:
  • 文章: 408
  • 积分: 562
  • 来自: 河南郑州
   发表时间：2008-12-01  
yunhaifeiwu 写道
谢谢哥们，让我大开眼界了！

javasript 太灵活强大了！

如果要作为一种数据结构，不可少的是数据元素的插入，修更，访问，删除操作！

关联数组能胜任！

我个人感觉,js的数组是最适宜完成这个工作的,关联数组在js里其实就是普通对象Object,但是没有
js数组的切片,链接等方法.这些方法组合起来就是插入，修更，访问，删除
返回顶楼
          回帖地址
1 请登录后投票
  • yunhaifeiwu
  • 等级: 初级会员
  • 性别:
  • 文章: 184
  • 积分: 90
  • 来自: 宁波
   发表时间：2008-12-01   最后修改：2008-12-01
achun 写道
yunhaifeiwu 写道
谢谢哥们，让我大开眼界了！

javasript 太灵活强大了！

如果要作为一种数据结构，不可少的是数据元素的插入，修更，访问，删除操作！

关联数组能胜任！

我个人感觉,js的数组是最适宜完成这个工作的,关联数组在js里其实就是普通对象Object,但是没有
js数组的切片,链接等方法.这些方法组合起来就是插入，修更，访问，删除

谢谢兄台了！ 是的，本质一样。切片大致看了一眼！
返回顶楼
          回帖地址
1 请登录后投票
  • 3Seefans
  • 等级: 初级会员
  • 性别:
  • 文章: 1
  • 积分: 30
  • 来自: 广州
   发表时间：2008-12-01  
yunhaifeiwu 写道
本人在用js书写UI组件道路上正不断探索与学习，下面是自已的理解与学习笔记。
本博文与另一篇博文《javascript函数式编程---解决事件参数传递问题》
构成了用js实现书写UI组件的基础知识，及实现的技术手段。
笔记很多，仅选用了自认为对同样道路上有用的朋友。
关于封装的总的方法论，时机到了再发布。


3.1 javascript 模拟类

说明：
1 在javascript中，函数就是一个特简单的类。定义了一个函数，就定义了一个类。可用var关键字与new关键字为该函数生成一个对象。
例： 
function Aa(){var dd="ddd"};//类名是Aa
var aa1=new Aa();//aa1 是类Aa的对象。同时Aa()函数就是Aa类的构造函数。


2 函数中，前缀有“this.”的变量，就是刻函数类的公有变量与公有方法。

3 注意 this 关键字的使用，它指向当前对象。


例 ： 
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body> 

<script language=Javascript>
  function Pasta(aaa ){　　//构造方法,同时也是类名
　　     this.aaa= aaa;//定义属性, 
         this.ddd="ddd"; //定义属性,
         this.bb=cc;//定义方法
         this.eee=function(){alert("cc")};//另一种方法定义及实现
　}
 
  function cc(){//方法实现
	  document.write(this.aaa);
  }
  // 另一种方法定义与实现
  Pasta.prototype.dd= function(d){
	 alert(d);
  }
 var xx=new Pasta("hello word");//为类Pasta生成一个名叫xx的对象
 xx.bb("sssss");//使用对象
 xx.dd("sssxxxx");
 xx..eee();

</script>

</body>
</html>





3.2 prototype使用----能简单模拟类

说明： (经walkman指出，在这里作了更改)
(1) 所有函数都具有prototype属性。
(2) 函数可当成一个类，可用new为该函数生成一个函数对象。
(3) 可用prototype为函数动态新增函数属性与方法。
(4) 假定有一个函数名为 Afun,则用prototype可为Afun增加属性与方法。此时所有的Afun对象都具有这些属性与方法。
(5) 特别注意：假定有一个对象名为anObj,但无法用prototype为anObj增加属性与方法。
    如： 
function Dd(){};//定义一个空的类
var dd=new Dd();//生成一个Dd对象
;//动态为Dd类增加一个xx属性,从此时起所有的Dd对象都具有xx属性。
Dd.prototype.xx="22";
//动态为Dd类增加一个say函数,从此时起所有的Dd对象都具有say函数。
Dd.prototype.say=function(){alert(this.xx)}; 
dd.say(); //执行后，将显示一个信息框，内容为22
var bb=new Dd();//再生成一个Dd对象
bb.say();//执行后，将显示一个信息框，内容为22
//也就是说bb,dd都能调用用prototype定义的属性与函数

结论：
使用prototype能模拟类


3.3 apply与call 使用

appply是所有函数都具有的方法。其作用时，调用该函数，参数通过参数表的形式传入；同时还传递一个对象到该函数的this对象中。
调用形式： functionName.apply(obj,[“zhang”,”34”]);
其义是：调用functionName函数，其参数是”zhang”,”34”,同时在functionName函数执行时，其内部的this对象还具有一个属性obj。注意：这个obj不是functionNam函数固有的，随着apply调用变化而变化。
     这个apply动态传一个对象到被调用函数的this对象中，是为特殊应用而生。
另外：1  arguments是每个函数都固有的对象，存放着该函的参数
2  call与apply类似，仅参数方式不同。
例： 
functionName.call(obj,“zhang”,”34”)



例： 

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body><script language=Javascript>

function parent(name,age){
   this.name=name;
   this.age=age;
   this.say=function(){ 
      alert(this.name);
   }
}

function Son(){
   var dd1="ha ha ha";
   this.tel="11";
   //调用parennt函数，且此时的该函数（即parennt）内的this对象具有dd1的属性。注意：
   //仅限于本次执行时才能确定具有dd1的属性。
   parent.apply(dd1,["zhang"]);
   this.calltel=function(){
      alert(this.tel);
   }

}
var s = new Son("ss","aa");
s.calltel();

</script>
</body>
</html>

用途：
    可用在下面的情景中。
当模拟类继承时，子类构造函数，通过apply调用父类的构造函数。这样执行子类构造函数，也能执行父类的函数。


3.4 模拟类继承

使用prototype与apply实现类继承的模拟。用prototype把父类的公有方法与公有变量加入到子类中去。在子类构造方法中，用apply执行父类的构造方法。
例： 

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
 

<script language=Javascript>
  function Parent(){　　//父类
	     this.pname="parentName";//父类公有变量
	     this.say=function(){alert(this.pname)};//父类公有方法
	     this.tell=function(){alert(this.pname+"tell")};//父类公有方法
　}
  function Son(){　
          
	    //以下两句要先执行，不然不能完成方法覆盖
    Son.prototype=new Parent();//得到父类的公有变量与公有方法　 
	    Parent.apply(this); //调用父类的构造函数           
     
	    this.sname="sonName";//子类公有变量
	    this.say=function(){alert(this.sname)};//子类公有方法，覆盖了父类的say方法
	    this.talk=function(){alert(this.sname+"talk")};//子类公有方法
　}
 
  var son1=new Son();
  son1.say();//显示 sonName,表时成功覆盖父类
  son1.talk();//显示 sonNametalk ，执行子类自已的方法
  son1.tell();//显示 parentNametell ,执父类没被覆盖的方法。
  son1.pname="父亲老张"; //使用父类的变量 
  son1.tell();//显示 父亲老张  表明成功使用了父类的公有方法与属性
  son1.sname="儿子小张"; //用子类自已的变量
  son1.say(); //显示 儿子小张 表明子类的属性与覆盖方法正常
  son1.talk();//显示 儿子小张 表明子类的属性与方法正常

var son2=new Son();//生成另一个子类，研究子类是否是对父类的方法与变量的拷贝
  son2.pname="母亲李夫人";
  son2.tell();//显示  母亲李夫人； 表明成功使用父类的方法
  son1.tell();//显示 父亲老张；  表明多个子类使用的同名的父类的变量，各有自已的值。 

</script>

</body>
</html>



3.5 用js实现自已定义的类体系

3.5.1 说明：
(1) 本节实例多半摘自悟透javascript一书。
(2) 本节中的类是用javascript语法，实现了自已设定的类体系结构。
(3) Javascript原本是没有类的，只有函数。其他一些章节中提到的类，仅仅是模拟类体系罢了。而这里是要用javascript自已实现一套类体系

3.5.2 语法规定
Create函数-----类的构造函数；
Class 函数------类定义函数
New 函数-----产生类的实例。
object---所有自定义类的基类。
说明：javascript区分大小写，自身的关键字为：new Object
自定义的类，如下形式表式： 
var Person ={ //定义名为Person的类
	  Create: function(name, age) {//Create指明构造函数
		  this.name = name;//定义类公有变量
		  this.age = age; //定义类公有变量
	  },
	  SayHello: function(){//定义公有方法
		  alert("Hello, I'm " + this.name);
	  },
	  HowOld: function(){//定义公有方法
	      alert(this.name + " is " + this.age + " years old.");
	  }
};

说明：
（1）上例是自已定义的类体系使用例子。例子中定义了一个名为Person的类，其构造方法，由Create指明。
（2）本例中可直接用Person.SayHello()的形式，调用方法。但是无法得到公有变量值，即name与age.解决方法。
    （3）在调用了Create函数后，Person类就有了name变量与age变量。 为了说明方便见下例： 

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>

<script language=Javascript>

var Person ={ //定义名为Person的类
	  Create: function(name, age) {//Create指明构造函数
		  this.name = name;//定义类公有变量
		  this.age = age; //定义类公有变量
	  },
	  SayHello: function(){//定义公有方法
		  alert("Hello, I'm " + this.name);
	  },
	  HowOld: function(){//定义公有方法
	      alert(this.name + " is " + this.age + " years old.");
	  }
};

//  //该语句执行后，Penson类就有了name与age变量。
//  Person.Create("dd1","ss1");

function Fun(){Person.Create("dd","ss");};//定义了一个名为Fun的函数，
Fun.prototype=Person;//让Fun拥有Person类的成员

//一旦执行了Fun函数，就执行了Person.Create方法，
//Person.Create方法一执行，Person就有了公有变量name与age
//当Person有了公有变量时，由于Fun中有Person类成员，因此Fun也就有了name变量
//与age变量。
var p =new Fun();
p.SayHello();// 显示“Hello, I'm dd ”， 这表明了p具有了变量name与age.

</script>



3.5.3 New实现
为了生成自定义类的对象，定义了New方法，该方法原型为：
New(aClass, aParams)
其中：aClass 类,该类定义中要有Create方法。aParams类构造函数的参数表.
实现时：
（1）生成一个临时函数，该函数要执行类定义中的Create方法。
（2） 这个临时函数具有aClass对象；
（3） 生成临时函数的对象，并返回给调用者。 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>18-1.html</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<script language="javascript">
    //aClass 类，该类定义中有名为Create的函数；aParams 类构造函数的参数表。
    function New(aClass, aParams) { 
        function new_() { //定义临时函数
            aClass.Create.apply(this, aParams); //调用类的构造函数，并执行
        }; 
        
		//让临时函数具有aClass类
        new_.prototype = aClass;  
		//生成临时函数的对象。生成时要执行该临时函数，该临时函数会执行类的
		//构造函数。类构造函数一旦执行，类就有了公有变量，从而拥有该类的临时
		//函数也就具有了类的公有变量。
        var a=new new_();
        return a;          //返回aClass的实例
    }; 
    
    //*******************下面是具自定义类的使用*******************]
	//定义Person类
    var Person = { 
        Create: function(name, age){ //定义构造函数
            this.name = name; //定义公有变量
            this.age = age; //定义公有变量
        }, 
        SayHello: function() { //定义公有方法
            alert("Hello, I'm " + this.name); 
        }, 
        HowOld: function() { //定义公有方法
            alert(this.name + " is " + this.age + " years old."); 
        } 
    }; 
     
    var BillGates = New(Person, ["Bill Gates", 53]);  //生成Person类的实例
	 //使用Person的实例
    BillGates.SayHello();
    BillGates.HowOld(); 
  
</script>
</body>
</html>


3.6 自定义类体系实现及使用 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>20-1.html</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<script language="javascript">
    // 根类 实现,注意object不是的关键字。Object才是固有的。
    var object = {  
	     // 判断本实例是否属于指定的类。 
        isA: function(aType)  { 
            var self = this; 
            while(self) 
            { 
                if (self == aType) 
                  return true; 
                self = self.Type; //由于类的继承原故，因此要循环。
            }; 
            return false; 
        } 
    }; 
    
	// 类定义函数 实现。该函数实现了一个类的定义
	//aBaseClass----父类；aClassDefine子类
    function Class(aBaseClass, aClassDefine) { 
	    //临时函数
        function class_()  { 
            this.Type = aBaseClass;  //保存类的父类类型，注：不是祖先类
		    //复制类定义
            for(var member in aClassDefine) 
                this[member] = aClassDefine[member];    
        }; 
		//让临时函数拥有父类
        class_.prototype = aBaseClass; 
		//生成临时函数的对象，并返回。该临时函数不仅有父类成员，也有子类成员，
		//另外还通过type保存了类的父类的类型。
        return new class_(); 
    }; 
    
	//实例生成函数实现
	//aClass---类；aParams---类构造函数的参数表
    function New(aClass, aParams)  { 
	    //临时函数
        function new_()  { 
            this.Type = aClass;//保存该实例的类型   
			//如果类定义中有名为Create的函数，则执行。
			//这个Create是我们约定的构造函数
            if (aClass.Create) 
              aClass.Create.apply(this, aParams); //执行构造函数   
        }; 
		//让临时函数拥有aClass类
        new_.prototype = aClass; 
		//生成临时函数的实例，并返回给调用者。该实例有类中的所有公有
		//变量与方法，还有一个公有变量Type保存着该实例的类型。
        return new new_(); 
    }; 
    
     //*********************自定义类体系使用*************************
	 //定义一个Person类，父类是object
     var Person = Class(object,
	    //下面是Person类定义的描述
	    { 
          Create: function(name, age) { //定义构造函数
             this.name = name; //定义公有变量
             this.age = age; //定义公有量
         }, 
         SayHello: function() { //定义公有方法
             alert("Hello, I'm " + this.name + ", " + this.age + " years old."); 
         } 
     }); 
     
	 //定义一个Employee类，继承于Person类
     var Employee = Class(Person,    
	    //个Employee类的定义描述
       { 
         Create: function(name, age, salary) { 
             Person.Create.call(this, name, age);  //调用基类的构造函数 
             this.salary = salary; 
         }, 
         ShowMeTheMoney: function() { 
             alert(this.name + " $" + this.salary); 
         } 
     }); 
     
	 //生成Person类的实例
     var BillGates = New(Person, ["Bill Gates", 53]); 
	 //生成Employee类的实例
     var SteveJobs = New(Employee, ["Steve Jobs", 53, 1234]); 
     BillGates.SayHello(); 
     SteveJobs.SayHello(); 
     SteveJobs.ShowMeTheMoney(); 
     
	 //根据 BillGate的类型创建 LittleBill 
     var LittleBill = New(BillGates.Type, ["Little Bill", 6]);   
     LittleBill.SayHello(); 
      
     alert(BillGates.isA(Person));       //true 
     alert(BillGates.isA(Employee));     //false 
     alert(SteveJobs.isA(Person));       //true 
     alert(Person.isA(Employee));        //false 
     alert(Employee.isA(Person));        //true 
</script>
</body>
</html>



返回顶楼
          回帖地址
0 请登录后投票
  • yunhaifeiwu
  • 等级: 初级会员
  • 性别:
  • 文章: 184
  • 积分: 90
  • 来自: 宁波
   发表时间：2008-12-01   最后修改：2008-12-02

经fins与achun网友的建议，不用关联数组一词。在这里，重新改一下。注意：这里还是站在数据结构的视点上看问题


   在js中，有些对象 可方便模拟java中所说的map，或者模拟有些数据结构教材中的哈希表。（注意：
仅仅是模拟，倒底等不等同需要考证）
  
   理解性的归纳，暂不作说明，仅给出例子。如果要参考理解性归纳总结，看分界线后的内容。
（注意理解性归纳总结，不等于事实是这样，仅仅方便于理解罢了）


   例1：用花括符定义的对象，模拟map相关操作
    
   
       
        //用花括符定义了一个对象root，模拟java中的map对象
        var root= {a1:'a1',a2:'a2',a3:function(){alert("hello");} };
        root.aa="aaa";//向root动态增加一个属性；模拟 map的put操作，即新增数据
        root.aa="aaa1";//修改root中属性aa的数据,模拟map的get 操作与put操作。即完成数据的修改
        root.bb="bbb"; //向root动态增加一个属性；模拟 map的put操作，即新增数据
        delete root.aa;//删除root中的属性；模拟map的remover操作，即完成数据删除

        for(var k in root) {
           alert(root[k]);  };//root[k] ,是读取root中属性为k的数据；模拟map的get操作，即完成数据读取
       root.a3();//调用root中定义的a3函数.这个没有对应的模拟了。


例 2： 用两个类似json的形式分别定义几个函数，并 合并到一个对象中。
说明：1 来源于ymPrompt组件的源码，但作了修改.
       2 这里用了类似json的形式，仅是为了描述的准确性。倒底是不是json，没有考证。有可能本身就是json,
有可能不是（可以肯定与json的形式高度相同）。 
 
//用类似json的形式定义了函数  (倒底是不是，不想去考证了，太累了） 
var c={ 
    d:"d1111",
    ds:function( ){
        alert("sss");
    },
    copy:function(o,c){//这是一个把c中定义的函数与变量，拷贝到对象o中。
        o=(o&&typeof o=='object')?o:{};
       if (o && c && typeof c == 'object')for(var p in c)o[p] = c[p];
           return o;
     }
}

// 用类似json的形式定义了函数tel,也定义了一个变量b.并把它们全部复制到对象c中
c.copy(c,{b:"b111",
        tel:function(){
            alert("c.copy");
        }
});

c.tel();        //由于两处定义的函数被拷贝y到一处了，故这里可直接调用tel函数了。


 



如果要跨越式思维，快速把数据结构引到js中，还是看下面的吧。在这里，让你非常
强烈的感受到js中用花括号定义的对象之强悍！
但这里容易引起误理解，要特别注意.

这是以前的记录
========================================================================

说明：

  1   经fins网兄建义，对于有些不恰当的词句，现作适当修改。而对于“关联数组”一词，fins感觉不恰当，但本人现暂没想到其他词汇，暂不作修改。（这里仅是站在数据结构的视角上描述）

  2  在这里，为了减少给他人造成的误解，特强制义定义本文中的关联数组的含义：

     关联数组--------下标索引是字符串的数组。

  3 以后，本人与大家在js方面交流时，不再用关联数组这个词。如果要用到类似的东东仅列举例子，然后跳过。

   
 
JSON强大的数据结构


  可用作map,用作树，用作一维数组，多维数组等。

json可以描述一个树状结构的对象。各个节点，要么是一个普通对象，要么是函数，要么是一个由前两者组成的复合对象。
   当一个对象，由json定义时，该对象可当作一个关联数组使用。可动态的增加、删除、修改元素。每个元素要么是一个普通对象、要么是一个函数、要么是由这两者组成的复合对象。（注意：本文中的概念，仅是理解并不严密与准确，重点看例子，进行总结与印证）

   例1 ，展示了一个对象元素新增、修改、删除操作 
       
        var root= {a1:'a1',a2:'a2',a3:function(){alert("hello");} };
        root.aa="aaa";//插入新元素
        root.aa="aaa1";//修改元素值
        root.bb="bbb"; //插入新元素
        delete root.aa;//册除元素

        for(var k in root) {
           alert(root[k]);  };//遍历元素值。当遍历到a3时，把函数定义体当字符串输出。
       root.a3();//调用root中定义的a3函数


例 2： 用两个json分别定义几个函数，并 合并到一个对象中。
说明：1 来源于ymPrompt组件的源码，但作了修改.
       2 注释中多处关于关联数组的地方，是指可当作下标索引是字符串的数组使用。 
//定义了一个关联数组。该数组中有普通对象，及函数
//定义形式是用json. 
var c={ 
    d:"d1111",
    ds:function( ){
        alert("sss");
    },
    copy:function(o,c){//把关联数组c中的值追加到o中
        o=(o&&typeof o=='object')?o:{};
       if (o && c && typeof c == 'object')for(var p in c)o[p] = c[p];
           return o;
     }
}

// 把用json定义的关联数组追加到对象c中。c本身也是一个关联数组。
c.copy(c,{b:"b111",
        tel:function(){
            alert("c.copy");
        }
});

c.tel();        //由于两处定义的函数被copy到一处了，故这里可直接调用tel函数了。

返回顶楼
          回帖地址
0 请登录后投票
  • fins
  • 等级: 资深会员资深会员
  • 性别:
  • 文章: 3196
  • 积分: 2953
  • 来自: 小胖儿的大城
   发表时间：2008-12-01  
楼主啊 你这是知识分享呢 还是学习笔记呢?
如果是知识分享 那么 很遗憾的告诉你 你分享了很多错误的知识.
这样的结果就是"容易误导其他新手"

如果是学习笔记呢 那么你要说明下: 本文的内容为个人观点,不保证其正确性.

===============
看了你的其他文章 觉得你是一个很爱专研和学习的人 但是我觉得你似乎选错了教材.
返回顶楼
          回帖地址
0 请登录后投票
  • yunhaifeiwu
  • 等级: 初级会员
  • 性别:
  • 文章: 184
  • 积分: 90
  • 来自: 宁波
   发表时间：2008-12-01   最后修改：2008-12-01
fins 写道
楼主啊 你这是知识分享呢 还是学习笔记呢?
如果是知识分享 那么 很遗憾的告诉你 你分享了很多错误的知识.
这样的结果就是"容易误导其他新手"

如果是学习笔记呢 那么你要说明下: 本文的内容为个人观点,不保证其正确性.

===============
看了你的其他文>章 觉得你是一个很爱专研和学习的人 但是我觉得你似乎选错了教材.


谢谢大虾！

在文中开头，就指出了属于学习笔记与理解！正在不断的探索！ （看你楼上的楼上的兄弟的的全文引用吧，
这位兄台是想纠我小辫子呢，还是想帮我作证，^_^,开个玩笑）

我很不喜欢跟着教材走，不管是什么样的教材！当一个知识无法与自身的认知相融合，
再优秀的教材都变得不优秀了！

就拿apply 与call来说，微软的msdn够准确到位吧？可惜太难理解，看中文与看外文一个样！
再说prototype，我看了许多到位的解说，可惜我领悟能力太低了，只好自已调试总结！

正如在前面的回贴中所说：我的目标是寻找到一个能封装组件的方法，为了这个目标，先想先思，
再实践，遇着问题再寻找或尝试解决。有许多概念性的东西都属于自已理解。

我发贴一是希望得到别人的指正，二是有供他人参考 。

说实在的，有许多东西不是教材中就有的，也不是网上就有的。就拿js中事件响应函数来说，如何
向这个函数传递自定义参数，在网上没找到答案！在许多教村中也没找到答案。这可是我无意中搜
到函数式编程，发现了一个简单的例子，可惜这个简单例子，又把事件源对象弄丢了。又调试，才
发现现arguments有。又说js中如何找一个像java中的map吧，在网上就没搜到答案。问的人倒有一大
群。就是看到一个关联数组，也与自已要找的相差较远。但是一个数据结构，在软件设计中是多
么的重要！我的学习过程与笔记，也许现在这些东东在各位眼中是错误的，严重影响性能，有的还会
出现内存泄露！可是，我至少在寻找一种设计方法，在努力整合自已的知识体系。

本人所发的博文凡是标有原创的，都是本人的学习笔记，是自已寻找、调试、理解、综合的产
物，仅供参考。但有一点，本人所发的源代码，经过调试过的。没有经过调试过的，都会特别注明。

再次申明，本人的博文是自已的学习笔记，不保证内容全部正确，仅供参考！因此给各位网页带来的不便，再次说声
抱歉！还有这个组件的封装，也正在探索之中。如果有结果了。会抽空全部整理成文的。尽可能减少错误，理解尽可不
出偏差，尽可能的表达准确！谢谢！
返回顶楼
          回帖地址
0 请登录后投票
  • fins
  • 等级: 资深会员资深会员
  • 性别:
  • 文章: 3196
  • 积分: 2953
  • 来自: 小胖儿的大城
   发表时间：2008-12-01   最后修改：2008-12-01
建议你多看看其他js组件/框架的代码 应该能学到很多吧
例如你说的 向事件响应函数传递自定义参数之类的.

另外 你的一些概念有错误
虽然死抠概念 没什么意义
不过 有些概念和术语还是统一一下比较好.

不应该总是自创概念.
例如你说的那个 关联数组, 在php perl中或许有种叫法
但是在js 中, 没见过谁这么叫的.

而且严格来说 关联数组和对象 完全不同.
你用 关联数组来指代 js的对象 是错误的.


返回顶楼
          回帖地址
0 请登录后投票
  • yunhaifeiwu
  • 等级: 初级会员
  • 性别:
  • 文章: 184
  • 积分: 90
  • 来自: 宁波
   发表时间：2008-12-01   最后修改：2008-12-01
fins 写道
建议你多看看其他js组件/框架的代码 应该能学到很多吧
例如你说的 向事件响应函数传递自定义参数之类的.

另外 你的一些概念有错误
虽然死抠概念 没什么意义
不过 有些概念和术语还是统一一下比较好.

不应该总是自创概念.
例如你说的那个 关联数组, 在php perl中或许有种叫法
但是在js 中, 没见过谁这么叫的.

而且严格来说 关联数组和对象 完全不同.
你用 关联数组来指代 js的对象 是错误的.





弱弱的红着脸说，我不敢抢别人的专利。因为《javascript权威指南》第四版 第154页使用了这个叫法。
（http://cache.baidu.com/c?m=9d78d513d99b12eb0bacc53e565491711925971337c0a61f68a5905fe0174c40377192c830566613a5c06b100ab8492dfd813c65440937c6eddffc3dc9fcd27620d26172320b87320fce5cea8e5125b6279012feaf6eb6e7af2fe5f3978fc25756cb53076d8087d11c5f4a&p=82769a4581d81ef808e297285a&user=baidu）
这本书的电子教材可到www.gougou.com输入名字中搜，可下载。说明：本人没闲劲看这种教材。


在这本书里，明确指出了，关联数组，是下标索引是字符串的。

还有，javascript 中 当如下定义一个变量 var dd={};
这个对象，本质上就是一个关联数组！！！！！！！！！！！！这个是我的推断。

如果 这样定义 var dd="aa" 这个就不是关联数组了。这个在前面已经作了批注了！





返回顶楼
          回帖地址
0 请登录后投票
  • fins
  • 等级: 资深会员资深会员
  • 性别:
  • 文章: 3196
  • 积分: 2953
  • 来自: 小胖儿的大城
   发表时间：2008-12-01  
我不认同这本书中的说法
js的对象 可以充当 关联数组
但是 如果 把 {} 理解为关联数组 我觉得是不对的

关联数组是一种特殊的对象 但是两者不能画全等号
返回顶楼
          回帖地址
0 请登录后投票
论坛首页 → 入门技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics