小废博客之web开发 小废就是我 http://xiaofeizm55333.javaeye.com UTF-8 Copyright 2003-2008, JavaEye.com http://blogs.law.harvard.edu/tech/rss JavaEye - 做最棒的软件开发交流社区 javaScript 的 StringBuffer 类 xiaofeizm55333 作者: xiaofeizm55333  链接：http://xiaofeizm55333.javaeye.com/blog/103552  发表时间: 2007年07月21日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

java 中的字符串拼装一般都不直接用String ，而是使用 StringBuffer，主要是出于性能考虑

javaScript 中也是一样的，直接使用 “2”+“3” 这种字符串相加对于性能消耗是很大的。

但是 javaScript 中没有现成的 StringBuffer 类，要自己封装，从网上找了几个，都写得太简单了

于是自己动手改写了一个，封装了一下，提供给大家使用。

js 代码
  1. /**  
  2.  * StringBuffer Class, to join two string is the most use  
  3.  * @author xiaofei 2007-7-20   
  4.  */  
  5. function StringBuffer()   
  6. {   
  7.     this._strings = [];   
  8.     if(arguments.length==1)   
  9.     {   
  10.         this._strings.push(arguments[0]);   
  11.     }   
  12. }   
  13.   
  14. StringBuffer.prototype.append = function(str)   
  15. {   
  16.     this._strings.push(str);   
  17.     return this;   
  18. }   
  19.   
  20. StringBuffer.prototype.toString = function()   
  21. {   
  22.     return this._strings.join("");   
  23. }   
  24.   
  25. /* 返回长度 */  
  26. StringBuffer.prototype.length = function()   
  27. {   
  28.     var str = this._strings.join("");   
  29.     return str.length;   
  30. }   
  31.   
  32. /* 删除后几位字符 */  
  33. StringBuffer.prototype.del = function(num)   
  34. {   
  35.     var len = this.length();   
  36.     var str = this.toString();   
  37.     str     = str.slice(0,len-num);   
  38.     this._strings = [];   
  39.     this._strings.push(str);   
  40. }  

本文的讨论也很精彩，浏览讨论>>


JavaEye推荐



]]> Sat, 21 Jul 2007 09:01:55 +0800 http://xiaofeizm55333.javaeye.com/blog/103552 http://xiaofeizm55333.javaeye.com/blog/103552 javaScript中的Function对象的说明 xiaofeizm55333 作者: xiaofeizm55333  链接：http://xiaofeizm55333.javaeye.com/blog/83591  发表时间: 2007年05月27日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

很多人都不理解javaScript 中的Function是什么，与function 又有什么区别
简单的说呢 function 是函数，而Function是类

在javaScript 我们声明一个函数，实际上是创建了一个 Function 类的对象。

例如：

  1. function sayHello(name)   
  2. {   
  3.   alert("Hello "+name);   
  4. }   

这是一个最简单的函数，参数为name，然后在参数前加上"Hello ",输出
同样，我们也可以这样声明函数
var sayHello = new Function("name","alert('Hello '+name)");
在这种形式中,第一个参数是sayHello 函数的参数，第二个参数是sayHello 函数的函数体

通过这种形式，我们可以很清楚的看出所谓的函数只不过是Function类的一个对象
而函数名只不过是对这个对象的引用。可以简单的把函数名理解成为一个指针，指向所引用的
Function 类的实例。

因为函数名只不过是对象名，所以可以可以把函数名作为参数传递，如下：

js 代码
  1. function callSay(funNam,argu)   
  2. {   
  3.   funNam(argu);   
  4. }   
  5.   
  6. callSay(sayHello,"xiaofei");   

ok，看到了，你完全可以把函数名当一个变量名来使用，因为它就是一个变量名。
你也可以这么使用

js 代码
  1. function sayHello()   
  2. {   
  3.   alert("Hello");   
  4. }   
  5. function sayBye()   
  6. {   
  7.   alert("Bye");   
  8. }   
  9.   
  10. sayHello = sayBye;  

这样 sayHello 和 sayBye 所指向的就是同一个函数，也就是说他们指向同一个Function类的实例。

Function类，对于我们实际编程来说，很少使用到，但是理解它，有助于我们对于javaScript中函数的理解。

Ok，既然函数只是Function类的一个对象，一个实例，所以自然地，它就会有方法和属性。
属性：length--代表函数定义的形参个数，prototype--原型属性，相信这是大家都非常熟悉的一个属性，可以用它来实现构造类，还有arguments，constructor，callee，caller等
方法：valueOf()，toString() --这两个方法返回的都是函数的源代码，apply(),call() 这两个方法大同小异，区别就是参数不同。

现在我们应该清楚，函数名就是变量名。

js 代码

本文的讨论也很精彩，浏览讨论>>


JavaEye推荐



]]> Sun, 27 May 2007 17:35:48 +0800 http://xiaofeizm55333.javaeye.com/blog/83591 http://xiaofeizm55333.javaeye.com/blog/83591 ajax jsp 无刷新上传文件 xiaofeizm55333 作者: xiaofeizm55333  链接：http://xiaofeizm55333.javaeye.com/blog/81120  发表时间: 2007年05月19日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

    首先要说的就是 ajax 是无法实现上传文件的，可以想一下ajax与后台通信都是通过传递字符串，怎么能传递文件呢？其实出于安全考虑js是不能操作文件的，所以就不要再说用ajax来实现文件的上传了，这是不可能的。
    而本文实现的文件上传也是无页面刷新的，可以说是一种"类似AJAX"方法。
    开始之前先说两句无关的，其实在ajax出现之前，web应用也可以是无刷新的，那时大多通过IFrame来做到这一点。当然Ajax出现之后，人们一窝蜂地投奔Ajax 的阵营了，iFrame 就乏人问津了。但是用iFrame来实现无刷新上传文件确实一个很好的选择。ps：Ajax技术基本上可以说是由google公司带起来的，但少Gmail中上传文件用的还是 IFrame，所以说使用IFrame来上传文件是最好的选择。
    我在这里这里用的技术是jsp，其实asp，php等也是一样可以这么实现的
    一共两个文件就可实现：index.html 和 upload.jsp，在这里讲解一下，文后会附上源码

--index.html
html 代码
  1. ＜html＞   
  2. ＜body＞   
  3.   
  4. ＜form action="upload.jsp" id="form1" name="form1" encType="multipart/form-data"  method="post" target="hidden_frame" ＞   
  5.     ＜input type="file" id="file" name="file" style="width:450"＞   
  6.     ＜INPUT type="submit" value="上传文件"＞＜span id="msg"＞＜/span＞   
  7.     ＜br＞   
  8.     ＜font color="red"＞支持JPG,JPEG,GIF,BMP,SWF,RMVB,RM,AVI文件的上传＜/font＞                 
  9.     ＜iframe name='hidden_frame' id="hidden_frame" style='display:none'＞＜/iframe＞   
  10. ＜/form＞   
  11.   
  12. ＜/body＞   
  13. ＜/html＞   
  14.   
  15. ＜script type="text/javascript"＞   
  16. function callback(msg)   
  17. {   
  18.     document.getElementById("file").outerHTML = document.getElementById("file").outerHTML;   
  19.     document.getElementById("msg").innerHTML = "＜font color=red＞"+msg+"＜/font＞";   
  20. }   
  21. ＜/script＞  


 index.html 中主要要做的就是写一个 form 和 iframe ，并把 form 的 target 设为 iframe 的名字，注意要把 iframe 设为不可见，其他的都是正常的文件上传的写法，这样刷新的页面就是这个隐藏的 Iframe ，而在 index.html 中是不会有页面刷新的，js的 callback 方法是回调方法。用于清空文件上传框和显示后台信息，注意清空文件上传框的方法，和普通方法有点不一样。

--upload.jsp

jsp 代码
  1. ＜%@ page language="java" contentType="text/html; charset=gb2312" %＞   
  2. ＜%@ page import="com.jspsmart.upload.SmartUpload"%＞   
  3.   
  4. ＜%   
  5.     //新建一个SmartUpload对象   
  6.     SmartUpload su = new SmartUpload();   
  7.   
  8.     //上传初始化   
  9.     su.initialize(pageContext);   
  10.   
  11.     // 设定上传限制   
  12.     //1.限制每个上传文件的最大长度。   
  13.     su.setMaxFileSize(10000000);   
  14.   
  15.     //2.限制总上传数据的长度。   
  16.     su.setTotalMaxFileSize(20000000);   
  17.   
  18.     //3.设定允许上传的文件（通过扩展名限制）,仅允许doc,txt文件。   
  19.     su.setAllowedFilesList("doc,txt,jpg,rar,mid,waw,mp3,gif");   
  20.        
  21.     boolean sign = true;   
  22.        
  23.     //4.设定禁止上传的文件（通过扩展名限制）,禁止上传带有exe,bat,jsp,htm,html扩展名的文件和没有扩展名的文件。   
  24.     try {   
  25.         su.setDeniedFilesList("exe,bat,jsp,htm,html");   
  26.   
  27.         //上传文件   
  28.         su.upload();   
  29.         //将上传文件保存到指定目录   
  30.         su.save("c:\\");  
  31.  
  32.     } catch (Exception e) {  
  33.         e.printStackTrace();  
  34.         sign = false;  
  35.     }  
  36.     if(sign==true)  
  37.     {  
  38.         out.println("＜script＞parent.callback('upload file success')＜/script＞");  
  39.     }else  
  40.     {  
  41.         out.println("＜script＞parent.callback('upload file error')＜/script＞");   
  42.     }   
  43. %＞   




upload.jsp 中只要注意最后输出的格式就可以了。其实原理就是输出一段js代码到 iframe 中，然后在iframe中来控制它的父页面。

    OK，至此一个无刷新的页面上传组件就做好了，不要忘了在 WEB-INF/lib 下加上必须的 jspSmartUpload.jar 包。
    需要说明的是使用Iframe来上传，状态栏还是会有刷新的，因为iframe 中的页面刷新了嘛，但是外部页面，就是你所看到的页面是没有刷新的，所以也可以说是类似Ajax上传。
本文的讨论也很精彩，浏览讨论>>


JavaEye推荐



]]> Sat, 19 May 2007 16:48:27 +0800 http://xiaofeizm55333.javaeye.com/blog/81120 http://xiaofeizm55333.javaeye.com/blog/81120 javaScript 中 call 函数的用法说明 xiaofeizm55333 作者: xiaofeizm55333  链接：http://xiaofeizm55333.javaeye.com/blog/80913  发表时间: 2007年05月18日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

javaScript 中的 call() 是一个奇妙的方法，但也是一个让人迷惑的方法，先看一下官方的解释：

call 方法
请参阅
应用于：Function 对象
要求
版本 5.5
调用一个对象的一个方法，以另一个对象替换当前对象。

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])
参数
thisObj
可选项。将被用作当前对象的对象。
arg1, arg2, , argN
可选项。将被传递方法参数序列。
说明
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。

-------------------------------------------------------------------------------------------
乍一看，很容易把人看迷胡，先做一些简单的说明
obj1.method1.call(obj2,argument1,argument2)
如上，call的作用就是把obj1的方法放到obj2上使用，后面的argument1..这些做为参数传入．

举一个具体的例子
function add(a,b)
{
    alert(a+b);
}
function sub(a,b)
{
    alert(a-b);
}

add.call(sub,3,1);

这个例子中的意思就是用 add 来替换 sub，add.call(sub,3,1) == add(3,1) ，所以运行结果为：alert(4); // 注意：js 中的函数其实是对象，函数名是对 Function 对象的引用。


看一个稍微复杂一点的例子

function Class1()
{
    this.name = "class1";

    this.showNam = function()
    {
        alert(this.name);
    }
}

function Class2()
{
    this.name = "class2";
}

var c1 = new Class1();
var c2 = new Class2();

c1.showNam.call(c2);

注意，call 的意思是把 c1 的方法放到c2上执行，原来c2是没有showNam() 方法，现在是把c1 的showNam()方法放到 c2 上来执行，所以this.name 应该是 class2，执行的结果就是 ：alert（"class2"）;

怎么样，觉得有意思了吧，可以让a对象来执行b对象的方法，这是java程序员所不敢想的。还有更有趣的，可以用 call 来实现继承

function Class1()
{
    this.showTxt = function(txt)
    {
        alert(txt);
    }
}

function Class2()
{
    Class1.call(this);
}

var c2 = new Class2();

c2.showTxt("cc");

这样 Class2 就继承Class1了，Class1.call(this) 的 意思就是使用 Class1 对象代替this对象，那么 Class2 中不就有Class1 的所有属性和方法了吗，c2 对象就能够直接调用Class1 的方法以及属性了，执行结果就是：alert（“cc”）;

对的，就是这样，这就是 javaScript 如何来模拟面向对象中的继承的，还可以实现多重继承。

function Class10()
{
    this.showSub = function(a,b)
    {
        alert(a-b);
    }
}

function Class11()
{
    this.showAdd = function(a,b)
    {
        alert(a+b);
    }
}


function Class2()
{
    Class10.call(this);
    Class11.call(this);
}

很简单，使用两个 call 就实现多重继承了
当然，js的继承还有其他方法，例如使用原型链，这个不属于本文的范畴，只是在此说明call 的用法
说了call ，当然还有 apply，这两个方法基本上是一个意思
区别在于 call 的第二个参数可以是任意类型，而apply的第二个参数必须是数组，也可以是arguments
还有 callee，caller，这个和call的 用法就不同了，放到下次讲吧 ，呵呵。
本文的讨论也很精彩，浏览讨论>>


JavaEye推荐



]]> Fri, 18 May 2007 15:49:00 +0800 http://xiaofeizm55333.javaeye.com/blog/80913 http://xiaofeizm55333.javaeye.com/blog/80913