分享我常用的Javascript工具函数

//----- 获得json数据的字符串格式 ---------------                        
Object.prototype.toString=function(){
    var rtn="{"; 
    for(var i in this){
       rtn+=i+":"+this[i]+",";
    }
    rtn=rtn.substring(0,rtn.length-1);
    rtn+="}";
    return rtn;
}

Array.prototype.toString=function (){
    var rtn="[";
    for(var i in this){
      rtn+=this[i]+",";
    }
    rtn=rtn.substring(0,rtn.length-1)+"]";
    return rtn;
}
//-------------- Array添加indexOf方法 ------------
//*** 返回某个元素在数组中的索引值 ***
Array.prototype.indexOf=function(item){
    for(var i=0;i<this.length;i++){
        if(this[i]==item) return i;
    }
    return -1;
};

//----------------- swDisplay(o)  -----------
//*** 函数 切换元素的显示和隐藏 ***
function swDisplay(o){
    var dv=(o.currentStyle||window.getComputedStyle(o,null)).display;
    switch (dv){
    case "":
        o.style.display="none";
        break;
    case "block":
        o.style.display="none";
        break;
    case "inline":
        o.style.display="none";
        break;
    case "none":
        o.style.display="block";
        break;
    default:
        break;
    }
}

function swDisplayBetter(evObj,evType,targetObj){ // swDisplayBetter($('evDiv'),'click',$('tDiv'))
    //evObj[evType]=function(){ swDisplay(targetObj);}
    if(document.all){
        evObj.attachEvent('on'+evType,function(){ swDisplay(targetObj);});
    }else{
        evObj.addEventListener(evType,function(){ swDisplay(targetObj);},false);
    }
}

//-----------------  getCookie(cname), setCookie(cname,cvalue,expiresDays)  --------------------
//*** cookies的读写函数  ***
// 读取cookie  getCookie(cookiename)
function getCookie(Cname){
    var start=document.cookie.indexOf(Cname+'=');
    if(start<0){
       return null;
    }
    else{
       start+=Cname.length+1; //Cname=后面
       //fname=pan;
      var endPos=(document.cookie+';').indexOf(';',start);// ;号前面
       return   document.cookie.substring(start,endPos);
    }
}
//写入cookies
function setCookie(Cname,Cvalue,expiresDays){ //cookies名称 cookies值 几天过期
    var expires=new Date();
    expires.setTime(expires.getTime()+expiresDays*24*60*60*1000);
    document.cookie=Cname+'='+Cvalue+';expires='+expires.toGMTString(); //增加cookies 不会覆盖旧的cookies
    //alert(document.cookie);
}

//----------------- getElementsByClassName ------------------
//*** 根据class获取元素 ***
function getElementsByClassName(clsName,root,tag){
    if(root){ //root为id或者父节点
        root=typeof root==='string'?document.getElementById(root):root;
    }else{
      root=document;
    }
     var nodeArr=[]; 
     var tag= tag || "*"; //查找某种标签的class 还是所有标签的class
     var subEles=root.getElementsByTagName(tag);
    for(var i=0,l=subEles.length;i<l;i++){
      if(subEles[i].className.indexOf(clsName)>=0){nodeArr.push(subEles[i])}
    }
    return nodeArr;
}

example:
 var mcNodes=getElementsByClassName("mc");
 var mcNodes=getElementsByClassName("mc","p1"); 
 var mcNodes=getElementsByClassName("mc",null,"p");
 var mcNodes=getElementsByClassName("mc","p1","b");

//---------------------- addClass(obj,itsClass) ------------------------------

function addClass(obj,itsClass){
    if (obj.className.toString()=="") { //若没有设置class
        obj.className=itsClass;
    }
    else if(obj.className.indexOf(itsClass)<0){
        obj.className+=" "+itsClass;
    }
   
}

function addClass(obj,clsName){
    if(obj.className.indexOf(clsName)<0)
      obj.className=obj.className==""?clsName:(obj.className+" "+clsName);
}

利用条件运算符的结合性会更简洁一点

function addClass(obj,clsName){
 var re=new RegExp("(\\s+"+clsName+"| ^"+clsName+"\\s+)","g");
 var re1= new RegExp("^"+clsName +"$","g");
 var ifhas = re.test(obj.className) || re1.test(obj.className);
 obj.className+=obj.className==''?clsName:ifhas?'':' '+clsName;
}

//---------------------- removeClass(obj,itsClass) ------------------------------

//~~算法逻辑是对的 显得繁琐了点 建议用正则方式 简单明了 replace()支持正则 和 函数参数 
function removeClass(obj,itsClass){
    if(obj.className.toString().indexOf(" ")>=0){//若包含空格 即class 中定义多个类名
        if(obj.className.indexOf(itsClass)>=0) obj.className=obj.className.replace(" "+itsClass,"");
    }
    else {
        if(obj.className.indexOf(itsClass)>=0) {obj.className=obj.className.replace(itsClass,"");}
    }
}

function removeClass(obj,clsName){
 var re=new RegExp("(\\s+"+clsName+"| ^"+clsName+"\\s+)","g");
 var re1= new RegExp("^"+clsName +"$","g");
 obj.className=re1.test(obj.className) ? "" : obj.className.replace(re,"");
}

//---------------------- setMoverMout(obj,itsClass) ----------------------------
//*** 设置元素的onmouseover onmousout ***
//~~~结合addClass  removeClass函数使用

function setMoverMout(obj,itsClass){
    obj.onmouseover=function(){addClass(this,itsClass);}; 
    obj.onmouseout=function(){removeClass(this,itsClass);};
    //上下文环境为obj,所以匿名函数内 this指向obj,this作为实参传入addClass函数
}

//-------------  each(eles,fn) -----------------------
//*** 遍历数组元素,每个元素作为参数传入fn并执行 ***
function each(eles,fn){
    for(var i=0;i<eles.length;i++){
        fn(eles[i]); //fn接受一个dom元素作为参数 或者 fn(domEle,index,eles){}
    }
}

//------------------------------------ addEvent ----------------------------------
//obj需要绑定事件的元素, type 事件类型, func 事件处理函数
//注意在事件处理函数 func 内部,不能用this来引用事件源对象,this指向了window ;需要用event.srcElement||event.target获取事件源对象
function addEvent(obj,type,func){ 
    if(document.all){ //for ie
        obj.attachEvent( "on"+type, function(e){func.apply(obj,arguments);} );
    }else{ //for FF
        obj.addEventListener( type, function(e){func.apply(obj,arguments)}, false ); //可以用fn.apply绑定fn内this的指向
    }
}


//....... Example .............

function hi(){alert("nice to meet you");}

addEvent($("hi"),"click",hi);

function addBg(event){(event.srcElement||event.target).style.background="#c9a47a";}
function removeBg(event){(event.srcElement||event.target).style.background="none";}

addEvent($("hi"),"mouseover",addBg);
addEvent($("hi"),"mouseout",removeBg);

//------------------------ on(node,eventType,handler,scope) ---------------------
//*** 工具函数 给对象的事件绑定事件处理函数 ***
// on函数比addEvent函数多了个 scope参数,更加灵活一点
function on(node,eventType,handler,scope){  
 node=typeof node=="string" ? document.getElementById(node) : node;  
 if(!!!node) { alert('没找到对应的dom元素'); return;}
 scope=scope || node;  
 if(document.all){  // for ie
 node.attachEvent("on"+eventType,function(){  
   handler.apply(scope,arguments) 
   // handler一般在全局环境定义,this指向window,
   // 这里指定事件处理函数的上下文对象为事件源元素或 你希望的元素
   // 上下文对象 和 arguments 传入handler函数并执行 
  });  
} else { //for firefox 
node.addEventListener(eventType,function(){  
        handler.apply(scope,arguments)  
 },false);  
     //firefox 可以在捕获和冒泡阶段触发事件处理函数 ,false表示不在捕获阶段触发事件
}  
}  

//-------------------------------- getStyle() ------------------------
//获取元素的当前样式或计算样式

function getStyle(o,styleName){
    return (o.currentStyle||window.getComputedStyle(o,null))[styleName];
}

//------------------------- nobubble() ----------------------------
//阻止事件冒泡
function nobubble(event){
  //event 事件对象作为参数传入
  if(document.all){
    event.cancelBubble=true;
  }else{
    event.stopPropagation();
  }
}

//----------------------- String.prototype.replaceAll(fnd,rep) ------------
//String类 扩展方法 字符串查找替换
String.prototype.replaceAll(fnd,rep){
  return this.split(fnd).join(rep);
}

//--------------------- String.prototype.trim() -----------------------
//String类扩展方法trim 删除前后空格
String.prototype.trim=function(){
  return this.replace(/(^\s*)|(\s*$)/g,"");
};

//---------------- $tag(tag,root) ---------------------
//*** 根据tagname获取元素的全局函数 document.getElemntsByTagName(tag)的简写版
function $tag(tag,root){return (root||document).getElementsByTagName(tag);}

//------------------ $(id) ---------------
//*** document.getElementById(id) 的简写版 ***
function $(id){return document.getElementById(id);}


//------------------- bindMouseWheelEvent(obj,handler) ----------------------
//*** 给对象绑定鼠标滑轮事件 兼容各浏览器的方法 
//绑定滑轮事件 兼容各浏览器
//绑定滑轮事件 兼容各浏览器
function bindWheelEvent(obj,handler){
    if(document.addEventListener){ //ie以外的主流浏览器都支持
        //只有firefox有效  其他ie和非ie主流浏览器执行 dom.onwheelscroll=fn
        obj.addEventListener('DOMMouseScroll',handler,false); 
    }
    obj.onmousewheel=handler;
}

//----- example: ---------

each(colorTxts,function(obj){bindWheelEvent(obj,colorValChg);});
// 滚动鼠标滑轮的事件处理函数
function colorValChg(e){
    // alert(this.id); this指向事件源元素
    
    //获取event对象
    e=e||window.event;
    var data=(e.wheelDelta/24)||(e.detail/-1);//ie9 chrome up 24 down -24; firefox up -1 down 1;
    var colorV=parseInt(this.value,10)+data;
    colorV=(colorV>255||colorV<0)?0:colorV;
    this.value=colorV+'';
    var k,m,n;
    k=colorTxts[0].value;
    m=colorTxts[1].value;
    n=colorTxts[2].value;
    $('showColor').style.background='rgb('+k+','+m+','+n+')';
}

//---------------------------- extend(subCls,supperCls,px)---------------------------
//*** 继承

function extend(subCls,supperCls,px){ //subCls子类 supperCls父类 px对象 子类需要扩展的属性集合
    if(!subCls || !supperCls) throw Error ('extend error');
    var F=function(){};
    F.prototype=supperCls.prototype;
    subCls.prototype=new F(); //通过实例化获得新对象,新对象和supperCls.prototype对象 地址不同 属性集合相似
    subCls.prototype.constructor=subCls;
    subCls.supperClass=supperCls.prototype;
    if(px){
        for(var i in px){
            if(px.hasOwnProperty(k)) subCls.prototype[k]=px[k];
        }
    }
    return subCls;
}

//---------------------------- objAttr2arr(obj) ----------------------
//*** 把对象的属性赋值到数组中 并返回该数组 ***
function objAttr2arr(obj){
    var arr=[],i=0;
    for(arr[i++] in obj) /* empty statement */ ;
    return arr;
}


//--------------------- classOf(obj) -----------------
//*** 返回任意对象的类属性 对象的类型信息 ,正确返回js内置对象的对象类型***
function classOf(o){
    if(o===null) return 'null';
    if(o===undefined) return 'undefined';
    return Object.prototype.toString.call(o).slice(8,-1);
}
classOf([]);
classOf({});
classOf("hi");
classOf(function(){});
//------------------ Array.prototype.distinct ------------
//*** 扩展数组的方法,返回数组中不相同的元素
Array.prototype.distinct=function(){
    var oArrVals={};
    var arrRtn=[];
    for(var i=0,len=this.length;i<len;i++){
        if(oArrVals[this[i]]) continue;
        oArrVals[this[i]]=i;
        arrRtn.push(this[i]);
    }
    return arrRtn;
};
//------------------ Function.prototype.bind -------------
//*** 扩展函数类的方法,用闭包模拟ES5的bind方法,将函数绑定到特定的上下文对象和绑定部分实参
Function.prototype.bind=function(o /*,arg1,arg2...*/){
    var self=this,boundArgs=arguments; // arguments[0]=this, arguments[1]=arg1,...
    return function(){ //这是一个闭包
        var args=[],i;
        for(i=1;i<boundArgs.length;i++){
            args.push(boundArgs[i])
        }
        for(i=0;i<arguments.length;i++){
            args.push(arguments[i]);
        }
        return self.apply(o,args);
    }
}
//---------------------- array(args,n) ----------------------
//*** 把类数组对象转换为真正的数组对象
function array(args,n){ //args为类数组对象 , n 可选参数 表示从哪个索引开始转换
    return Array.prototype.slice.call(args,n||0);
}

//------------------------ JsonStringfy(o) --------------------
//*** json对象序列化 需要配合classOf函数获取类属性
function JsonStringfy(o){
    if(classOf(o)==='Array'){
        var s='[',n=0;
        for(var i=0;i<o.length;i++){
            if(n++) s+=',';
            if(classOf(o[i])==='Array' || classOf(o[i])==='Object'){
                s+=JsonStringfy(o[i]);
            }else{
                s+=o[i].toString();
            }
        }
        return s+=']';
    }
    if(classOf(o)==='Object'){
        var s='{',m=0;
        for(var p in o){
            if(!o.hasOwnProperty(p)) continue;
            if(m++) s+=',';
            if(classOf(o[p])==='Array' || classOf(o[p])==='Object'){
                s+=p+':'+JsonStringfy(o[p]);
            }else{
                s+=p+':'+o[p];
            }
        }
        return s+='}';
    }
    alert('not an Array or Object');
    return; 
}
var mobj={a:1,b:2,c:3,d:[4,5,6]};
var marr=['a','b','c',mobj];
alert(JsonStringfy(mobj));
alert(JsonStringfy(marr));

//--------------------------- parseXML(xmlfile) ------------------
//***解析xml文件的跨浏览器实现
function parseXML(xmlFile){
 try{ //ie
    var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    }
 catch(e){ //firefox,safari,opera 
    try{
        var xmlDoc=document.implementation.createDocument("","",null);
    }
    catch(e){
        alert(e.message);
        return;
    }
 }
 xmlDoc.async=false;
 xmlDoc.load(xmlFile);
}

//---------------------------- parseXMLString(xmlStr) -------------------
//*** 解析xml字符串的跨浏览器实现
function parseXMLString(xmlStr){
    try{ //ie
        var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async=false;
        xmlDoc.loadXML(xmlStr);

    }
    catch(e){
        try{ //firefox,opera,chrome
            var parser=new DOMParser();
            var xmlDoc=parser.parseFromString(xmlStr,"text/xml");
        }
        catch(e){
            alert(e.message);
            return;
        }
    }
        return xmlDoc;
}

//---------------------------------- sendAjax(url) ---------------------
//*** 发送ajax请求的跨浏览器实现
var xmlhttp; //因为stateChange函数需要xmlhttp对象 所以定义为全局的。 function sendAjax(url){ if(window.XMLHttpRequest){ //for new browser include ie 7 xmlhttp=new XMLHttpRequest(); } else if(window.ActiveXObject){ //for ie5/6 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } if(xmlhttp!=null){ xmlhttp.onreadystatechange=stateChange; xmlhttp.open("GET",url,true); xmlhttp.send(null); }else{ alert("your browser does not support XMLHTTP"); } } function stateChange(){ if(xmlhttp.readyState==4){ //loaded if(xmlhttp.status==200){// ok // our code here } } } //------------------ Array.prototype.filter(fn)--------------- //*** 返回能在fn中返回true的元素组成的新数组 Array.prototype.filter=function(fn){ //高阶函数filter var a=[]; for(var i=0;i<this.length;i++){ if(fn(this[i])) a.push(this[i]); } } example fn: function isOdd(n){ return parseInt(n)%2===1; } map each filter //----------------------------------------------------- //给一个函数绑定上下文对象和部分参数 proxy: function( fn, context ) { var args, proxy, tmp; if ( typeof context === "string" ) {//若参数2是字符串 则修正参数 tmp = fn[ context ]; context = fn; //参数1作为context,参数1[参数2]作为fn 形如:proxy(Array.prototype,'slice') fn = tmp; } if ( !jQuery.isFunction( fn ) ) {//参数1不是函数 则返回undefined return undefined; } // 模仿 bind 的原理 args = Array.prototype.slice.call( arguments, 2 ); //proxy函数第3个参数开始的参数列表 proxy = function() {//闭包 外部函数proxy的参数列表+闭包的参数列表形成新的args数组作为fn的参数 return fn.apply( context || this, args.concat( Array.prototype.slice.call( arguments ) ) ); }; // Set the guid of unique handler to the same of original handler, so it can be removed proxy.guid = fn.guid = fn.guid || jQuery.guid++; return proxy; }, //----- 参考jQuery的proxy方法,可给事件处理函数 提供附加的数据 ---- //** 事件处理函数以闭包的形式返回,父函数给其绑定所需数据 function handlerBindData(fn){ if(typeof fn !== 'function') return fn; //fn非函数 则直接返回fn 什么也不做 var args = Array.prototype.slice.call(arguments, 1); //第2个参数开始的参数数组 var _fn = function(){ fn.apply(this, Array.prototype.concat.call(Array.prototype.slice.call(arguments), args)); } return _fn; } function menuText(ev){ alert((ev.srcElement || ev.target).innerHTML); if(arguments[1]) alert('i am the first one'); } var menuTextWithData = handlerBindData(menuText, 'first');//绑定的参数+闭包的参数为实际的参数列表 $('firstLi').onclick = function(ev){menuTextWithData(ev)}; //------------------- fn.bind(oContent) -------------- //** 为函数绑定上下文对象,其实和上面的 handlerBindData一样的原理,都是返回一个绑定部分参数的闭包 Function.prototype.bind = function(oContext){ var that = this; return function(){ that.apply(oContext, arguments); }; }; function test(){ alert(this.hi);} var k = {'hi':'good'}; var test_ = test.bind(k); //封装原函数的一个闭包,绑定了上下文对象 //----------------- methodize(fn) --------------------------------- ** 借鉴Prototype的思想,把工具函数转化为方法函数,用面向对象的方式调用,从而避免了命名空间冲 突的问题。可以获取DOM元素时进行扩展,也可以直接扩展到DOM元素原型对象上,成为额外的固有方法 Function.prototype.methodize = function(fn){ return function(){ //返回一个包装原函数的闭包,闭包中绑定执行上下文,且让this成为第 一个形参的实参传入 var args=Array.prototype.slice.call(arguments); //获取其他参数 args.unshift(this); //让this作为第一个形参的值 fn.apply(this, args);//在指定上下文和绑定部分形参的情形下执行原有函数 } } ~~~example: function addClass(obj, cls){ if(typeof obj ==='string') obj = document.getElementById(obj); obj.className+=obj.className.indexOf(cls)>=0?'':obj.className===''? cls : ' '+cls; alert(obj.className); } window.onload = function(){ //addClass('test', 'hover'); var oTest = $id('test'); oTest.addClass('hover'); } $id = function(id){ var e = document.getElementById(id); e.addClass = addClass.methodize(); return e; }; //------------------- url后面的参数转换为json对象 -----------------------

function urlPara2json(){
if(location.href.indexOf('?')==-1) return null;
var obj;
var paraStr = location.href.substring(location.href.indexOf('?')+1);
var arr = paraStr.split('&');

function turn2pro(s){
obj = obj || {};
var arrPro = s.split('=');
if(obj[arrPro[0] ]){
if(typeof obj[arrPro[0] ] =='string'){ obj[arrPro[0] ] = [ obj[arrPro[0]] ]; }
obj[arrPro[0] ].push(arrPro[1]);
}else{
obj[arrPro[0] ] = arrPro[1];
}
}

for(var i = 0, len=arr.length; i<len; i++){
turn2pro(arr[i]);
}
console.log(obj);
return obj;
}

//------------------- 获取元素相对页面的offset -----------------------
function pageOffset(ele){
var x=0,y=0;
while(p = ele.offsetParent){
x+=ele.offsetLeft;
y+=ele.offsetTop;
ele = p;
}
return {"x":x,"y":y};
}

//------------------------ onDomLoaded ---------------------
/* 当dom加载完成时 执行回调函数 */
function onDomLoaded(fn){
if ( document.addEventListener ) {// for:firefox,opera, chrome
document.addEventListener( "DOMContentLoaded", fn, false );
} else if ( document.attachEvent ) {// for:ie
document.attachEvent( "onreadystatechange", function(){ if(document.readyState === 'complete') fn(); } );
}
}

//------------------------ hasClass ------------------------

/* 判断元素是否具有给定class名 */

function hasClass(obj,cls){
  return (new RegExp("(^|\\s+)"+cls+"(\\s+|$)",'i') ).test(obj.className);
}

or

function hasClass(obj,cls){
  return obj.className.split(' ').indexOf(cls)>=0 ;
}

//----------------------- inherits -------------------------
//****inherits method ~~~实际是在函数内封装了组合继承的实现方法
function inherits(superCls, methodObj){
function foo(){
superCls.apply(this, arguments);
}
function bar(){}
bar.prototype = superCls.prototype;
foo.prototype = new bar();
for(var k in methodObj ){
if(methodObj.hasOwnProperty(k)){
foo.prototype[k] = methodObj[k];
}
}
return foo.prototype.constructor = foo;
// return foo;
}

var subCls = inherits(superCls, {sing:function(){ console.log('i can sing
a song'); } });
var sub = new subCls('nice to meet you');

function superCls(w){
this.hi=w;
this.kind="fn";
}
superCls.prototype.say = function(){ alert(this.hi);}

//---------------------- JSON.parse, JSON.stringify --------------

//*** JSON序列化和反序列化  ie8+ ,现代浏览器支持的原生方法


作用:这个函数的作用主要是为了系列化对象的。 
可能有些人对系列化这个词过敏,我的理解很简单。就是说把原来是对象的类型转换成字符串类型(或者更确切的说是json类型的)。就这么简单。打个比方说,你有一个类,那么你可以通过这个方法转换成相应的json类型的。很简单吧。 
接着看。 
语法: 
JSON.stringify(value [, replacer] [, space]) 
value:是必须要的字段。就是你输入的对象,比如数组啊,类啊等等。 
replacer:这个是可选的。它又分为2种方式,一种是方法,第二种是数组。 
情况一:我们先说数据,通过我们后面的实验可以知道,它是和第一个有关系的。一般来说,我们系列化后的结果是通过键值对来进行表示的。 
比如说: 
name:"lan",age:25 
这种形式。 
所以,如果这种形式的话,如果第二个的值在第一个存在,那么的话就以第二个的值做key,第一个值为value进行表示,如果不存在,sorry,忽略。【是不是有点抽象,我也这么觉得,不过你等一下看实验 就OK了。。呼呼。】 
情况二:如果是方法,那很简单,就是说把系列化后的每一个对象(记住 是每一个)传进方法里面进行处理。 
space:很好理解,用什么来做分隔符的。 
1.如果省略的话,那么显示出来的值 就没有分隔符。直接输出来 
2.如果是一个数字的话,那么它就定义缩进几个字符,当然 如果大于10 ,则最大值为10. 
3.如果是一些转义字符,比如“\t”,表示回车,那么它每行一个回车。 
4.如果仅仅是字符串,OK,就在每行输出值的时候把这些字符串附加上去就OK。当然,最大长度也是10个字符。 
开始用实例说明; 
1.只有一个参数的情况下: 

复制代码代码如下:

var student = new Object(); 
student.name = "Lanny"; 
student.age = "25"; 
student.location = "China"; 
var json = JSON.stringify(student); 
alert(student); 


结果如下: 

有些人可能会怀疑JSON.stringify的作用,OK。那假如,我们不要这个函数。代码下面的样子: 

复制代码代码如下:

var student = new Object(); 
student.name = "Lanny"; 
student.age = "25"; 
student.location = "China"; 

// var json = JSON.stringify(student); 
alert(student); 


 恭喜你 得到的结果是: 

没骗你吧,继续。
2.第二个参数存在,并且第二个参数还是function的时候 

复制代码代码如下:

var students = new Array() ; 
students[0] = "Lanny"; 
students[1] = "dong"; 
students[2] = "I love you"; 
var json = JSON.stringify(students,switchUpper); 
function switchUpper(key, value) { 
return value.toString().toUpperCase(); 

alert(json); 

        //var json = JSON.stringify(students, function (key,value) { 

        //return value.toString().toUpperCase(); 

       //}); 


    上面的方法也可以换成下面的,2个都是一样,只是写法有那么一点点的不一样而已。 
 得到结果如下: 

3.第二个参数存在,并且第二个参数不是function,而是数组的时候。 
3.1 【误区】如果第一个参数是数组,第二个参数也是数组的话,只显示第一个参数的值。 
比如: 

复制代码代码如下:

var students = new Array() ; 
students[0] = "Lanny"; 
students[1] = "dong"; 
students[2] = "I love you"; 
var stu = new Array(); 
stu[0] = "1"; 
stu[1] = "2"; 
var json = JSON.stringify(students,stu); 
alert(json); 


 sorry 得到的结果就是: 

第二个被忽略了,只是第一个被系列化了。 

3.2 如果第一个是对象(这里说的对象就像在C#里面可以进行new的),第二个是数组的。 

那么如果第二个的value在第一个存在,那么的话就以第二个的值做key,第一个值为value进行表示 

复制代码代码如下:

var student = new Object(); 
student.qq = "5485891512"; 
student.name = "Lanny"; 
student.age = 25; 

var stu = new Array(); 
stu[0] = "qq"; 
stu[1] = "age"; 
stu[2] = "Hi";//这个student对象里不存在。 

var json = JSON.stringify(student,stu); 
alert(json); 


 得到的结果如下: 

因为stu[2] = "Hi";这个Hi 在第一个找不到,所以就不进行显示了。 

4.第三个参数 

4.1.如果省略的话,那么显示出来的值 就没有分隔符。直接输出来 

比如: 

复制代码代码如下:

var student = new Object(); 
student.qq = "5485891512"; 
student.name = "Lanny"; 
student.age = 25; 

var stu = new Array(); 
stu[0] = "qq"; 
stu[1] = "age"; 
stu[2] = "Hi"; 

var json = JSON.stringify(student,stu); 
alert(json); 


 输出的就是: 

4.2.如果是一个数字的话,那么它就定义缩进几个字符,当然 如果大于10 ,则最大值为10. 

复制代码代码如下:

var student = new Object(); 
student.qq = "5485891512"; 
student.name = "Lanny"; 
student.age = 25; 

var stu = new Array(); 
stu[0] = "qq"; 
stu[1] = "age"; 
stu[2] = "Hi"; 

var json = JSON.stringify(student,stu,100);//注意这里的100 
alert(json); 


那么得到的是: 

空开来了10个字符。 

4.3.如果是一些转义字符,比如“\t”,表示回车,那么它每行一个回车。 

也是一样。 

4.4.如果仅仅是字符串,OK,就在每行输出值的时候把这些字符串附加上去就OK。当然,最大长度也是10个字符。 

如果是var json = JSON.stringify(student,stu,“HaiKou”);//

就这样吧 。good night。 

原文地址:https://www.cnblogs.com/stephenykk/p/3084356.html