javascript常用代碼段搜集
1.json轉(zhuǎn)字符串
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.時(shí)間戳轉(zhuǎn)為Date
function fromUnixTime(timeStamp) {
if (!timeStamp || timeStamp < 1000 || timeStamp == ' ') return "";
var theDate = new Date(parseInt(timeStamp) * 1000);
return theDate;
}
3.Data-format
// 作者: meizz
// 對(duì)Date的擴(kuò)展,將 Date 轉(zhuǎn)化為指定格式的String
// 月(M)、日(d)、小時(shí)(h)、分(m)、秒(s)、季度(q) 可以用 1-2 個(gè)占位符,
// 年(y)可以用 1-4 個(gè)占位符,毫秒(S)只能用 1 個(gè)占位符(是 1-3 位的數(shù)字)
// 例子:
// (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(), //小時(shí)
"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 時(shí),父窗體與子窗體之間的相互調(diào)用
// 父窗體調(diào)用子窗體內(nèi)的函數(shù)
window.frames['ifm_id'].valueChange("id_101");
// 子窗體調(diào)用父窗體的函數(shù)
parent.refreshTree("nodeId_202");
6. 彈出窗體與返回值
// 彈出窗體
var url = " win=window.showModalDialog(url,window,"dialogLeft:400;dialogTop:200;dialogWidth:560px;dialogHeight:380px;scroll:yes;menubar:no;toolbar:no;status:no;");
// 在彈出窗體中設(shè)置返回值
var result = new Array();
result[0] = "id_101";
result[1] = "name_202";
window.returnValue = result;
window.close();
7. javascript 作用域[只有全局作用域和函數(shù)作用域,javascript沒(méi)有塊作用域]
// 1. 全局作用域
var id = "global variable"; // 1.1 在函數(shù)外部定義的變量
function showMsg(){
message = "global message";// 1.2 未定義而直接賦值的變量
// 在第一次使用時(shí)被定義為全局變量
}
// 2. 函數(shù)作用域
function doCheck(){
var data = "function data";// 2.1 在函數(shù)內(nèi)部定義的變量
}
8. javascript 繼承機(jī)制
// 1. 對(duì)象冒充繼承
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; // 刪除臨時(shí)變量 parent
// 定義新屬性及方法
// private fields
var school = strSchool;
// public methods
this.getSchool = function(){
return school;
};
}
// 2. Funtion 對(duì)象的 call(..) 或 apply(..) 繼承
// call 和 apply 的區(qū)別在于:
// call 的第二個(gè)參數(shù)為可變參數(shù);
// apply 的第二個(gè)參數(shù)為 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 聲明的屬性及方法被所有對(duì)象共享
// prototype 只有在讀屬性的時(shí)候會(huì)用到
Function.prototype.extend = function(superClass){
// 此處的 F 是為了避免子類訪問(wèn)父類中的屬性 this.xxx
function F(){};
F.prototype = superClass.prototype;
// 父類構(gòu)造函數(shù)
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 內(nèi)部時(shí) this 所指示的對(duì)象
// call & apply 將立即執(zhí)行 fun 并返回結(jié)果
var result = fun.call(thisArg,arg1,...);
var result = fun.apply(thisArg,[argsArray]);
// thisArg 表示在 fun 內(nèi)部時(shí) this 所指示的對(duì)象
// bind 返回的是一個(gè)匿名函數(shù)
var tmpfun = fun.bind(thisArg);
var result = tmpfun(arg1,...);
<script type="text/javascript">
/**
* 擴(kuò)展 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 會(huì)立即執(zhí)行]
var tmpfun = child.getName.bind(parent);// bind 不會(huì)立即執(zhí)行
alert(tmpfun(3)); // show 3 parent
</script>
10. js "==" Operator
轉(zhuǎn)換規(guī)則
如果一個(gè)操作數(shù)是 Boolean 值,則比較之前將其轉(zhuǎn)成數(shù)字:false -> 0, true -> 1;
如果一個(gè)操作數(shù)是數(shù)字,另一操作數(shù)是字符串,則比較之前將字符串轉(zhuǎn)成數(shù)字;
如果一個(gè)操作數(shù)是對(duì)象,另一操作數(shù)是數(shù)字或字符串,則比較之前會(huì)將對(duì)象轉(zhuǎn)為基本類型,
引擎會(huì)先嘗試調(diào)用 valueOf(),如果 valueOf() 沒(méi)有 override 或返回一個(gè)對(duì)象,
則引擎會(huì)嘗試調(diào)用 toString(),如果 toString() 沒(méi)有 override 或返回一個(gè)對(duì)象,則拋出異常;
如果是兩個(gè)對(duì)象進(jìn)行比較,則判斷它們是否引用同一對(duì)象;
如果一個(gè)操作數(shù)是 NaN, == 將返回 false, != 將返回 true;
null 和 undefined 與其它值比較將返回 false,
但 null == null, undefined == undefined, null == undefined;
參與比較時(shí) null 和 undefined 不能轉(zhuǎn)為其它值;
相關(guān)文章
Bootstrap 網(wǎng)格系統(tǒng)布局詳解
在平面設(shè)計(jì)中,網(wǎng)格是一種由一系列用于組織內(nèi)容的相交的直線(垂直的、水平的)組成的結(jié)構(gòu)(通常是二維的)。這篇文章主要介紹了Bootstrap 網(wǎng)格系統(tǒng)布局,需要的朋友可以參考下2017-03-03JavaScript實(shí)現(xiàn)留言板實(shí)戰(zhàn)案例
這篇文章主要給大家介紹了關(guān)于JavaScript實(shí)現(xiàn)留言板的相關(guān)資料,使用JavaScript來(lái)編寫留言板功能相信大家都不陌生,文中給出了詳細(xì)的示例代碼,需要的朋友可以參考下2023-07-07在DWR中實(shí)現(xiàn)直接獲取一個(gè)JAVA類的返回值的兩種方法
本文主要介紹了在DWR中實(shí)現(xiàn)直接獲取一個(gè)JAVA類的返回值的兩種方法,具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2016-12-12JavaScript實(shí)現(xiàn)世界各地時(shí)間顯示
這篇文章主要為大家詳細(xì)介紹了javaScript實(shí)現(xiàn)世界各地時(shí)間顯示,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-09-09bootstrap響應(yīng)式導(dǎo)航條模板使用詳解(含下拉菜單,彈出框)
這篇文章主要為大家詳細(xì)介紹了bootstrap響應(yīng)式導(dǎo)航條模板使用詳解,含下拉菜單,彈出框效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-11-11JS實(shí)現(xiàn)漂亮的淡藍(lán)色滑動(dòng)門效果代碼
這篇文章主要介紹了JS實(shí)現(xiàn)漂亮的淡藍(lán)色滑動(dòng)門效果代碼,涉及JavaScript通過(guò)自定義函數(shù)遍歷頁(yè)面元素及動(dòng)態(tài)設(shè)置元素屬性的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09js+css實(shí)現(xiàn)回到頂部按鈕(back to top)
這篇文章主要為大家詳細(xì)介紹了js+css實(shí)現(xiàn)回到頂部按鈕back to top回到頂部按鈕,感興趣的小伙伴們可以參考一下2016-03-03PHP中如何unicode編碼,在JavaScript中h如何解碼
PHP中如何unicode編碼,在JavaScript中如何解碼?js中h這樣的,怎么轉(zhuǎn)碼?2023-07-07