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 相关文章推荐
ext combox 下拉框不出现自动提示,自动选中的解决方法
Feb 24 Javascript
javascript ajax的5种状态介绍
Aug 18 Javascript
BootStrap智能表单实战系列(七)验证的支持
Jun 13 Javascript
浅析Node.js实现HTTP文件下载
Aug 05 Javascript
Bootstrap超大屏幕的实现代码
Mar 22 Javascript
Angular2安装angular-cli
May 21 Javascript
JavaScript中Hoisting详解 (变量提升与函数声明提升)
Aug 18 Javascript
webpack学习笔记之优化缓存、合并、懒加载
Aug 24 Javascript
vue iview组件表格 render函数的使用方法详解
Mar 15 Javascript
Vue使用localStorage存储数据的方法
May 27 Javascript
微信小程序项目总结之记账小程序功能的实现(包括后端)
Aug 20 Javascript
前端如何实现动画过渡效果
Feb 05 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分页时出现的Fatal error的解决方法
2011/04/18 PHP
超级实用的7个PHP代码片段分享
2012/01/05 PHP
解析将多维数组转换为支持curl提交的一维数组格式
2013/07/08 PHP
ASP.NET jQuery 实例1(在TextBox里面创建一个默认提示)
2012/01/13 Javascript
jquery 实现密码框的显示与隐藏示例代码
2013/09/18 Javascript
node.js中使用q.js实现api的promise化
2014/09/17 Javascript
node.js中使用socket.io制作命名空间
2014/12/15 Javascript
javascript算法题:求任意一个1-9位不重复的N位数在该组合中的大小排列序号
2015/04/01 Javascript
强大的 Angular 表单验证功能详细介绍
2017/05/23 Javascript
jQuery实现下拉菜单的实例代码
2017/06/19 jQuery
JS移动端/H5同时选择多张图片上传并使用canvas压缩图片
2017/06/20 Javascript
微信小程序返回多级页面的实现方法
2017/10/27 Javascript
3种vue组件的书写形式
2017/11/29 Javascript
微信小程序实现星星评价效果
2018/11/02 Javascript
vue计算属性computed、事件、监听器watch的使用讲解
2019/01/21 Javascript
基于layui轮播图满屏是高度自适应的解决方法
2019/09/16 Javascript
JS使用setInterval计时器实现挑战10秒
2020/11/08 Javascript
探究Python的Tornado框架对子域名和泛域名的支持
2015/05/02 Python
在Python的Flask框架中验证注册用户的Email的方法
2015/09/02 Python
Python中格式化format()方法详解
2017/04/01 Python
利用Pyhton中的requests包进行网页访问测试的方法
2018/12/26 Python
python 接口实现 供第三方调用的例子
2019/08/13 Python
ansible动态Inventory主机清单配置遇到的坑
2020/01/19 Python
使用Python爬虫库BeautifulSoup遍历文档树并对标签进行操作详解
2020/01/25 Python
CSS3实现文本垂直排列的方法
2018/07/10 HTML / CSS
香港唯港荟酒店预订:Hotel ICON
2018/03/27 全球购物
全球速卖通俄罗斯站:AliExpress俄罗斯
2019/06/17 全球购物
商务日语毕业生自荐信范文
2013/11/14 职场文书
市场开发与营销专业求职信
2013/12/31 职场文书
怎样写好创业计划书的内容
2014/02/06 职场文书
终止或解除劳动合同及劳动关系的证明书
2014/10/06 职场文书
2015年宣传部个人工作总结
2015/05/14 职场文书
教师师德承诺书2016
2016/03/25 职场文书
疑《守望先锋2》A测截图泄露 或将推出新模式、新界面
2022/04/03 其他游戏
Python捕获、播放和保存摄像头视频并提高视频清晰度和对比度
2022/04/14 Python
Python循环之while无限迭代
2022/04/30 Python