javascript常用代码段搜集


Posted in Javascript onDecember 04, 2014

1.json转字符串

function json2str(o) {

    var arr = [];

    var fmt = function (s) {

        if (typeof s == 'object' && s != null) return json2str(s);

        return /^(string|number)$/.test(typeof s) ? "'" + s + "'" : s;

    };

    for (var i in o) arr.push("'" + i + "':" + fmt(o[i]));

    return '{' + arr.join(',') + '}';

}

2.时间戳转为Date

function fromUnixTime(timeStamp) {

    if (!timeStamp || timeStamp < 1000 || timeStamp == ' ') return "";

    var theDate = new Date(parseInt(timeStamp) * 1000);

    return theDate;

}

3.Data-format

// 作者: meizz  

// 对Date的扩展,将 Date 转化为指定格式的String   

// 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符,   

// 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字)   

// 例子:   

// (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2012-12-02 08:12:04.423   

// (new Date()).Format("yyyy-M-d h:m:s.S")      ==> 2012-12-02 8:12:4.18   

Date.prototype.Format = function(fmt) {  

    var o = {

        "M+": this.getMonth() + 1,                 //月份   

        "d+": this.getDate(),                    //日   

        "h+": this.getHours(),                   //小时   

        "m+": this.getMinutes(),                 //分   

        "s+": this.getSeconds(),                 //秒   

        "q+": Math.floor((this.getMonth() + 3) / 3), //季度   

        "S": this.getMilliseconds()             //毫秒   

    };

    if (/(y+)/.test(fmt))

        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));

    for (var k in o)

        if (new RegExp("(" + k + ")").test(fmt))

            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));

    return fmt;

};

4.日期上增加n天

function addDay(number) {

        return fromUnixTime(new Date().getTime() / 1000 + 24 * 60 * 60 * number);

}

5. 使用 iframe 时,父窗体与子窗体之间的相互调用

// 父窗体调用子窗体内的函数  

window.frames['ifm_id'].valueChange("id_101");  

// 子窗体调用父窗体的函数  

parent.refreshTree("nodeId_202"); 

6. 弹出窗体与返回值

// 弹出窗体  

var url = "http://www.baidu.com";  

win=window.showModalDialog(url,window,"dialogLeft:400;dialogTop:200;dialogWidth:560px;dialogHeight:380px;scroll:yes;menubar:no;toolbar:no;status:no;");  

// 在弹出窗体中设置返回值  

var result = new Array();  

result[0] = "id_101";  

result[1] = "name_202";  

window.returnValue = result;  

window.close(); 

7. javascript 作用域[只有全局作用域和函数作用域,javascript没有块作用域]

// 1. 全局作用域  

var id = "global variable";    // 1.1 在函数外部定义的变量  

function showMsg(){      

    message = "global message";// 1.2 未定义而直接赋值的变量  

                               //     在第一次使用时被定义为全局变量  

}  

// 2. 函数作用域  

function doCheck(){  

    var data = "function data";// 2.1 在函数内部定义的变量  

} 

8. javascript 继承机制

// 1. 对象冒充继承  

function Person(strName){  

    // private fields  

    var name = strName;  

    // public methods  

    this.getName = function(){  

        return name;  

    };      

}  

function Student(strName,strSchool){  

    // 定义父类的属性及方法      

    this.parent = Person;  

    this.parent(strName);  

    delete this.parent;        // 删除临时变量 parent  

    // 定义新属性及方法      

    // private fields  

    var school = strSchool;  

    // public methods  

    this.getSchool = function(){  

        return school;  

    };       

}  

// 2. Funtion 对象的 call(..) 或 apply(..) 继承  

//    call 和 apply 的区别在于:  

//      call  的第二个参数为可变参数;  

//      apply 的第二个参数为 Array;  

function Animal(strName,intAge){  

    // private fields  

    var name = strName;  

    var age = intAge;  

    // public methods  

    this.getName = function(){  

        return name;  

    };   

    this.getAge = function(){  

        return age;  

    };  

}  

function Cat(strName,intAge,strColor){  

    // 定义父类的属性及方法      

    Animal.call(this,strName,intAge);  

    // Animal.apply(this,new Array(strName,intAge));  

    // 定义新属性及方法      

    // private fields  

    var color = strColor;  

    // public methods  

    this.getInfo = function(){  

        return "name:" + this.getName() + "\n"  

             + "age:" + this.getAge() + "\n"  

             + "color:" + color;  

    };  

}  

// 3. prototype 继承  

//    prototype 声明的属性及方法被所有对象共享  

//    prototype 只有在读属性的时候会用到  

Function.prototype.extend = function(superClass){  

    // 此处的 F 是为了避免子类访问父类中的属性 this.xxx  

    function F(){};  

    F.prototype = superClass.prototype;  

    // 父类构造函数  

    this.superConstructor = superClass;  

    this.superClass = superClass.prototype;  

    this.prototype = new F();  

    this.prototype.constructor = this;  

};  

Function.prototype.mixin = function(props){      

    for (var p in props){          

        this.prototype[p] = props[p];          

    }  

};  

function Box(){}  

Box.prototype = {      

    getText : function(){  

        return this.text;  

    },  

    setText : function(text){  

        this.text = text;  

    }  

};  

function CheckBox(){}  

CheckBox.extend(Box);  

CheckBox.mixin({  

    isChecked : function(){  

        return this.checked;  

    },  

    setChecked : function(checked){  

        this.checked = checked;  

    }  

}); 

9. call , apply & bind

// thisArg 表示在 fun 内部时 this 所指示的对象  

// call & apply 将立即执行 fun 并返回结果  

var result = fun.call(thisArg,arg1,...);  

var result = fun.apply(thisArg,[argsArray]);  

// thisArg 表示在 fun 内部时 this 所指示的对象  

// bind 返回的是一个匿名函数  

var tmpfun = fun.bind(thisArg);  

var result = tmpfun(arg1,...); 
<script type="text/javascript">  

/** 

 * 扩展 Function 的功能 

 */  

Function.prototype.bind = function(obj){  

    var method = this;  

    var tmpfun = function(){  

        return method.apply(obj,arguments);  

    };  

    return tmpfun;  

}  

function Parent(){  

    this.name = "parent";  

}  

function Child(){  

    this.name = "child";  

    this.getName = function(time){  

        return time + " " + this.name;  

    };  

}  

var parent = new Parent();  

var child = new Child();  

alert(child.getName(1));                // show 1 child  

alert(child.getName.call(parent,2));    // show 2 parent [call & apply 会立即执行]  

var tmpfun = child.getName.bind(parent);// bind 不会立即执行  

alert(tmpfun(3));                       // show 3 parent  

</script> 

10. js "==" Operator

转换规则  

   如果一个操作数是 Boolean 值,则比较之前将其转成数字:false -> 0, true -> 1;  

   如果一个操作数是数字,另一操作数是字符串,则比较之前将字符串转成数字;  

   如果一个操作数是对象,另一操作数是数字或字符串,则比较之前会将对象转为基本类型,  

       引擎会先尝试调用 valueOf(),如果 valueOf() 没有 override 或返回一个对象,  

       则引擎会尝试调用 toString(),如果 toString() 没有 override 或返回一个对象,则抛出异常;  

   如果是两个对象进行比较,则判断它们是否引用同一对象;  

   如果一个操作数是 NaN, == 将返回 false, != 将返回 true;  

   null 和 undefined 与其它值比较将返回 false,  

       但 null == null, undefined == undefined, null == undefined;  

   参与比较时 null 和 undefined 不能转为其它值;   
Javascript 相关文章推荐
JavaScript入门教程(6) Window窗口对象
Jan 31 Javascript
jquery中子元素和后代元素的区别示例介绍
Apr 02 Javascript
jQuery中事件对象e的事件冒泡用法示例介绍
Apr 25 Javascript
Javascript刷新窗口方法小结
Oct 21 Javascript
javaScript+turn.js实现图书翻页效果实例代码
Feb 16 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
Apr 27 Javascript
JavaScript动态绑定详解
Sep 14 Javascript
探索webpack模块及webpack3新特性
Sep 18 Javascript
值得收藏的vuejs安装教程
Nov 21 Javascript
微信小程序实现鼠标拖动效果示例
Dec 01 Javascript
30分钟快速入门掌握ES6/ES2015的核心内容(上)
Apr 18 Javascript
基于vue3.0.1beta搭建仿京东的电商H5项目
May 06 Javascript
5种处理js跨域问题方法汇总
Dec 04 #Javascript
用js读、写、删除Cookie代码续篇
Dec 03 #Javascript
js字符串完全替换函数分享
Dec 03 #Javascript
基于jquery实现等比缩放图片
Dec 03 #Javascript
javascript简单实现图片预加载
Dec 03 #Javascript
3种Jquery限制文本框只能输入数字字母的方法
Dec 03 #Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 #Javascript
You might like
php性能优化分析工具XDebug 大型网站调试工具
2011/05/22 PHP
php通过Chianz.com获取IP地址与地区的方法
2015/01/14 PHP
PHP 接入微信扫码支付总结(总结篇)
2016/11/03 PHP
php-fpm添加service服务的例子
2018/04/27 PHP
Thinkphp 3.2框架使用Redis的方法详解
2019/10/24 PHP
JavaScript 闭包深入理解(closure)
2009/05/27 Javascript
javascript 数据类型转换(parseInt,parseFloat)
2010/07/20 Javascript
jquery.jstree 增加节点的双击事件代码
2010/07/27 Javascript
js模拟滚动条(横向竖向)
2013/02/22 Javascript
JS控制图片等比例缩放的示例代码
2013/12/24 Javascript
JQuery中上下文选择器实现方法
2015/05/18 Javascript
jquery插件tytabs.jquery.min.js实现渐变TAB选项卡效果
2015/08/25 Javascript
完美解决IE不支持Data.parse()的问题
2016/11/24 Javascript
jQuery延迟执行的实现方法
2016/12/21 Javascript
原生js仿浏览器滚动条效果
2017/03/02 Javascript
原生JS实现移动端web轮播图详解(结合Tween算法造轮子)
2017/09/10 Javascript
详解VUE 对element-ui中的ElTableColumn扩展
2018/03/28 Javascript
JS逻辑运算符短路操作实例分析
2018/07/09 Javascript
NodeJS模块与ES6模块系统语法及注意点详解
2019/01/04 NodeJs
jquery层次选择器的介绍
2019/01/18 jQuery
JavaScript监听触摸事件代码实例
2019/12/30 Javascript
JS localStorage存储对象,sessionStorage存储数组对象操作示例
2020/02/15 Javascript
[01:38]女王驾到——至宝魔廷新尊技能&特效展示
2020/06/16 DOTA
Python学习笔记之读取文件、OS模块、异常处理、with as语法示例
2019/06/04 Python
通过celery异步处理一个查询任务的完整代码
2019/11/19 Python
python 实现字符串下标的输出功能
2020/02/13 Python
python将dict中的unicode打印成中文实例
2020/05/11 Python
Python生成随机验证码代码实例解析
2020/06/09 Python
瑞士国际航空官网:SWISS
2016/07/21 全球购物
松下电器美国官方商店:Panasonic美国
2016/10/14 全球购物
彪马日本官网:PUMA日本
2019/01/31 全球购物
万代美国官网:PREMIUM BANDAI USA
2020/09/11 全球购物
应届生简历中的自我评价
2014/01/13 职场文书
租车协议书范本2014
2014/11/17 职场文书
2015年小学开学寄语
2015/02/27 职场文书
写给老师的保证书
2015/05/09 职场文书