前端常用js方法整理

前言

整理前端常用的一些函數(shù)


時間類

UTC()

方法接受的參數(shù)同日期構(gòu)造函數(shù)接受最多參數(shù)時一樣,返回從1970-1-1 00:00:00 UTC到指定日期的的毫秒數(shù)甜熔。

Date.UTC(year,month[,date[,hrs[,min[,sec[,ms]]]]])

now()

方法返回自1970年1月1日 00:00:00 UTC到當(dāng)前時間的毫秒數(shù)纺非。

var timeInMs = Date.now()

parse()

解析一個表示某個日期的字符串,并返回從1970-1-1 00:00:00 UTC 到該日期對象(該日期對象的UTC時間)的毫秒數(shù)

Date.parse(dateString)

getDate()

根據(jù)本地時間弱左,返回一個指定的日期對象為一個月中的第幾天炕淮。

var data=new Date()
data.getDate()

getDay()

據(jù)本地時間,返回一個具體日期中一周的第幾天们镜,0 表示星期天润歉。

var data=new Date()
data.getDay()

getFullYear()

根據(jù)本地時間踩衩,返回一個指定日期對象的年份。

var data=new Date()
data.getFullYear()

getHours()

方法根據(jù)本地時間锚赤,返回一個指定的日期對象的小時褐鸥。

var data=new Date()
data.getHours()

getMilliseconds()

根據(jù)本地時間,返回一個指定的日期對象的毫秒數(shù)浑侥。

var data=new Date()
data.getMilliseconds()

getMinutes()

根據(jù)本地時間晰绎,返回一個指定的日期對象的分鐘數(shù)寒匙。

var data=new Date()
data.getMinutes()

getMonth()

根據(jù)本地時間躏将,返回一個指定的日期對象的月份考蕾,為基于0的值(0表示一年中的第一月)

var data=new Date()
data.getMonth()

getSeconds()

方法根據(jù)本地時間肖卧,返回一個指定的日期對象的秒數(shù)

var data=new Date()
data.getSeconds()

add()

add(value,type)
在某個時間上新增時間,返回新增后的時間對象拦赠,格式不正確返回原時間對象葵姥,新增傳正數(shù),減傳負(fù)數(shù)允乐。

var year = new Date().add(1,'y').format('yyyy-MM-dd'); //2018-03-24
var month = new Date().add(1,'M').format('yyyy-MM-dd'); //2017-04-24
var day = new Date().add(1,'d').format('yyyy-MM-dd'); //2017-04-25
var hour = new Date().add(1,'hh').format('yyyy-MM-dd HH:mm:ss'); //2017-04-24 12:34:27
var minute = new Date().add(1,'m').format('yyyy-MM-dd HH:mm:ss');//2017-04-24 11:35:27
var second = new Date().add(1 * 60,'s').format('yyyy-MM-dd HH:mm:ss'); //2017-04-24 11:35:27
var millisecond = new Date().add(1000 * 60 ,'ms').format('yyyy-MM-dd HH:mm:ss');  //2017-04-24 11:35:27

addDays()

add(value,type)
新增指定天數(shù)削咆,返回新增后的時間對象拨齐,格式不正確則返回原時間對象。
addHours()【新增小時】
addMilliseconds()【新增毫秒】
addMinutes()【新增分鐘】
addMonths()【新增月】
addSeconds()【新增秒】
addYears()【新增年】

var date = new Date();
var newdate = date.addDays(1).format('yyyy-MM-dd'); //2017-03-25
var newdate = date.addYears(1).format('yyyy-MM-dd'); 
var newdate = date.addSeconds(1).format('yyyy-MM-dd');
var newdate = date.addMonths(1).format('yyyy-MM-dd'); 
var newdate = date.addMinutes(1).format('yyyy-MM-dd');
var newdate = date.addMilliseconds(1).format('yyyy-MM-dd');
var newdate = date.addHours(1).format('yyyy-MM-dd');

compareTo()

比較兩個時間大小厦滤,前者大于后者返回1熟史,等于返回0蹂匹,小于返回-1

new Date().compareTo(new Date('2017-03-24')) //1

dayOfweek()

返回某個時間星期幾

new Date().dayOfweek()  //星期五

diff()

比較兩個時間凹蜈,返回一個對象,包含一共差x天履植,或一共差x小時悄晃,或一共差x分鐘凿滤,或一共差x秒翁脆,或一共差x毫秒鼻种,格式不正確所有參數(shù)均為0。

var obj = new Date().diff(new Date('2017-03-24')) 
//Object {totaldays: 0, totalhours: 5, totalminutes: 345, totalseconds: 20732, totalmilliseconds: 20732392} 
var totalhours = obj.totalhours;  //5

diffFormat()

用于計算兩個時間一共差x天x小時x分鐘x秒罢缸,格式不正確返回空字符串投队。

new Date().diffFormat(new Date('2017-03-23'))  //1天 5小時 57分鐘 35秒

isLeapYear()

判斷是否是閏年敷鸦。

new Date().isLeapYear()  //false

isSame()

isSame(time,type)
判斷兩個時間的某個部分是否相同
【type只接受年月日和’date’,’all’,其中date用于判斷年月日,all判斷1970至現(xiàn)在的秒數(shù)】

new Date().isSame(new Date('2017-03-23'),'date')  //false

format()

將時間格式化

new Date().format('yyyy-MM-dd')  //2017-03-25

參考資源

javascript 標(biāo)準(zhǔn)庫 Date


字符串類

charAt()

從一個字符串中返回指定的字符钞螟。


concat()

將一個或多個字符串與原字符串連接合并谎碍,形成一個新的字符串并返回蟆淀。


endsWith()

該新特性屬于 ECMAScript 2015(ES6)規(guī)范,存在瀏覽器兼容性褒链。但是此方法已經(jīng)重寫疑苔,可以放心使用
方法用來判斷當(dāng)前字符串是否是以另外一個給定的子字符串“結(jié)尾”的,根據(jù)判斷結(jié)果返回 true 或 false兵迅。


startsWith()

該新特性屬于 ECMAScript 2015(ES6)規(guī)范薪贫,存在瀏覽器兼容性瞧省。但是此方法已經(jīng)重寫鳍贾,可以放心使用
用來判斷當(dāng)前字符串是否是以另外一個給定的子字符串“開頭”的交洗,根據(jù)判斷結(jié)果返回 true 或 false。


includes()

該新特性屬于 ECMAScript 2015(ES6)規(guī)范纵散,存在瀏覽器兼容性伍掀。但是此方法已經(jīng)重寫暇藏,可以放心使用
用于判斷一個字符串是否包含在另一個字符串中,根據(jù)情況返回true或false把兔。


indexOf()

方法返回指定值的第一次出現(xiàn)的調(diào)用 String 對象中的索引瓮顽,開始在fromIndex進(jìn)行搜索。如果未找到該值缕贡,則返回-1拣播。


lastIndexOf()

方法返回指定值在調(diào)用該方法的字符串中最后出現(xiàn)的位置贮配,如果沒找到則返回 -1。從該字符串的后面向前查找


match()

當(dāng)一個字符串與一個正則表達(dá)式匹配時昼蛀, match()方法檢索匹配項酣藻。


replace()

方法返回一個由替換值替換一些或所有匹配的模式后的新字符串鳍置。模式可以是一個字符串或者一個正則表達(dá)式, 替換值可以是一個字符串或者一個每次匹配都要調(diào)用的函數(shù)税产。


slice()

從一個字符串中提取字符串并返回新字符串偷崩。在一個字符串中的改變不會影響另一個字符串撞羽。也就是說诀紊,slice 不修改原字符串,只會返回一個包含了原字符串中部分字符的新字符串笤喳。


split()

將一個String對象分割成字符串?dāng)?shù)組碌宴,通過將字符串分成子串。


substr()

返回一個字符串中從指定位置開始到指定字符數(shù)的字符呜象。


substring()

返回一個字符串在開始索引到結(jié)束索引之間的一個子集, 或從開始索引直到字符串的末尾的一個子集碑隆。


toLowerCase()

會將調(diào)用該方法的字符串值轉(zhuǎn)為小寫形式上煤,并返回。


toUpperCase()

將調(diào)用該方法的字符串值轉(zhuǎn)換為大寫形式哥捕,并返回嘉熊。


toString()

方法返回指定對象的字符串形式阐肤。


trim()

方法會刪除一個字符串兩端的空白字符。在這個字符串里的空格包括所有的空格字符 (space, tab, no-break space 等)以及所有的行結(jié)束符(如 LF愧薛,CR)衫画。


trimAll()

去掉所有的空白符


toLowerCase()

該特性是非標(biāo)準(zhǔn)的削罩,但是此方法已經(jīng)重寫费奸,可以放心使用
方法移除原字符串左端的連續(xù)空白符并返回,trimLeft方法并不會直接修改原字符串本身.


trimRight()

該特性是非標(biāo)準(zhǔn)的进陡,但是此方法已經(jīng)重寫趾疚,可以放心使用
trimRight方法移除原字符串右端的連續(xù)空白符并返回,trimRight方法并不會直接修改原字符串本身


isNullOrEmpty()

判斷字符是否為null或空


format()

將字符傳轉(zhuǎn)換為指定的其他字符串

var str='hello {0}{1}{2}ld'.format("w","o","r")  //hello world

參考資源

javascript 標(biāo)準(zhǔn)庫 String


數(shù)字類

toFixed()

使用定點表示法來格式化一個數(shù)。

numObj.toFixed(digits)

toPrecision()

指定的精度返回該數(shù)值對象的字符串表示

numObj.toPrecision(precision)

toString()

方法返回指定 Number 對象的字符串表示形式戈二。

numObj.toString([radix])

abs()

函數(shù)返回指定數(shù)字 “x” 的絕對值觉吭。

Math.abs(x) 

ceil()

返回一個大于或等于數(shù) “x” 的最小整數(shù)

Math.ceil(x)

floor()

函數(shù)返回小于或等于數(shù) “x” 的最大整數(shù)仆邓。

Math.floor(x)

max()

函數(shù)返回一組數(shù)中的最大值节值。

Math.max([value1[,value2, ...]])

min()

返回零個或更多個數(shù)值的最小值。

Math.min([value1[,value2, ...]])

pow()

函數(shù)返回基數(shù)(base)的指數(shù)(exponent)次冪嗓蘑,即 baseexponent匿乃。

Math.pow(base, exponent)

random()

函數(shù)返回 [0-1) 的浮點值偽隨機數(shù)(大于等于0幢炸,小于1)。

Math.random()

round()

返回一個數(shù)值四舍五入后最接近的整數(shù)值佛嬉。

Math.round()

sqrt()

函數(shù)返回一個數(shù)的平方根

Math.sqrt(x)

sign()

函數(shù)用來判斷一個數(shù)字的符號, 是正數(shù), 負(fù)數(shù), 還是零.

Math.sign(x)

isFinite()

用來檢測傳入的參數(shù)是否是一個有窮數(shù)(finite number)闸天。

Number.isFinite(value)

isInteger()

方法用來判斷給定的參數(shù)是否為整數(shù)。

Number.isInteger(value)

isNaN()

方法用來檢測傳入的值是否是 NaN湾揽。該方法比傳統(tǒng)的全局函數(shù) isNaN() 更可靠钝腺。

Number.isNaN(value)

isSafeInteger()

方法用來判斷傳入的參數(shù)值是否是一個“安全整數(shù)”(safe integer)

Number.isSafeInteger(testValue)

formatMoney()

formatMoney(places,symbol,thousand,decimal)
將數(shù)字轉(zhuǎn)換成貨幣格式
參數(shù)【places】: Number 保留的小數(shù)位 默認(rèn)2
參數(shù)【symbol】: string 符號 默認(rèn)’$’
參數(shù)【thousand】: string 每三位的分隔符 默認(rèn)’,’
參數(shù)【decimal】:string 個位與小數(shù)的分隔符 默認(rèn)’.’

var revenue = 12345678;
var result = revenue.formatMoney(4,"",".","|"); //12.345.678|0000
var result2 = revenue.formatMoney();  //$12,345,678.00

currencyUpperCase()

將數(shù)字轉(zhuǎn)漢子大寫形式 小數(shù)最多支持4位

var revenue = 1234561000;
var result = revenue.currencyUpperCase();   //壹拾貳億叁仟肆佰伍拾陸萬壹仟元整

參考資源

javascript 標(biāo)準(zhǔn)庫 Number
javascript 標(biāo)準(zhǔn)庫 Math


數(shù)組類

push()

向數(shù)組的末尾添加一個或更多元素艳狐,并返回新的長度皿桑。


pop()

刪除并返回數(shù)組的最后一個元素


shift()

刪除并返回數(shù)組的第一個元素


unshift()

向數(shù)組的開頭添加一個或更多元素,并返回新的長度镀虐。


join()

把數(shù)組的所有元素放入一個字符串沟绪。元素通過指定的分隔符進(jìn)行分隔绽慈。


reverse()

顛倒數(shù)組中元素的順序恨旱。


sort()

對數(shù)組的元素進(jìn)行排序


concat()

連接兩個或更多的數(shù)組,并返回結(jié)果坝疼。


slice()

從某個已有的數(shù)組返回選定的元素


splice()

刪除元素搜贤,并向數(shù)組添加新元素


toString()

把數(shù)組轉(zhuǎn)換為字符串,并返回結(jié)果钝凶。


isArray()

判斷是不是數(shù)組


indexOf()

返回在數(shù)組中可以找到給定元素的第一個索引仪芒,如果不存在,則返回-1耕陷。


every()

測試數(shù)組的所有元素是否都通過了指定函數(shù)的測試掂名。


filter()

使用指定的函數(shù)測試所有元素,并創(chuàng)建一個包含所有通過測試的元素的新數(shù)組哟沫。


forEach()

方法對數(shù)組的每個元素執(zhí)行一次提供的函數(shù)。


map()

方法創(chuàng)建一個新數(shù)組南用,其結(jié)果是該數(shù)組中的每個元素調(diào)用一個提供的函數(shù)膀钠。


unique()

這是jquery提供的方法,去重

var arry=[1,2,1,3] $.unique(arry)

參考資源

javascript 標(biāo)準(zhǔn)庫 Array
w3school JavaScript Array 對象

其他擴展類

ConvertNetTDate()

返回一個javascript Date對象.
方法用來轉(zhuǎn)換C#通過json傳到前端的時間字符串中帶“T”的問題,如:"2017-03-01T16:33:03.73"

ConvertNetTDate("2017-03-01T16:32:46.927").format("yyyy-MM-dd")

isMobileUserAgent()

判斷是否移動設(shè)備訪問


isAppleMobileDevice()

判斷是否蘋果移動設(shè)備訪問


isAndroidMobileDevice()

判斷是否安卓移動設(shè)備訪問


DisableWeChatDrop()

禁用微信瀏覽器下拉回彈,頁面在微信瀏覽器中禁止下拉露底


GUID()

生成GUID

var guid = new GUID();
var g1=guid.newGUID()

表單操作

使用說明

需要引用jquery

//引用js
<script src="/jquery/3.1.1/jquery-3.1.1.min.js"></script>
<script src="/js-common-methods/0.0.1/js-common-methods.min.js"></script>

serializeJson()

序列化表單值為JSON
說明:元素不能被禁用(禁用的元素不會被包括在內(nèi))裹虫,并且元素應(yīng)當(dāng)有含有 name 屬性肿嘲,對于獲取不到的值,請自己手動賦值筑公。

$(selector).serializeJson()

解決disabled元素不能取值的方案:

var myform = $('#form');
var disabled = myform.find(':input:disabled').removeAttr('disabled');
var serialized = myform.serializeJson();
disabled.attr('disabled','disabled');

結(jié)果展示:

 {
    name: a,
    value: 1,
    age:20,
    ...
  }

fillForm()

根據(jù)JSON數(shù)據(jù)填充表單
說明:對于上傳圖片空間或者使用了i-check插件美化checkbox是無法自動填充的,需要自己手動填充雳窟。

$(selector).fillForm()

serializeArray()

序列化表單值來創(chuàng)建對象數(shù)組(名稱和值)
.serializeArray() 方法使用了 W3C 關(guān)于 successful controls(有效控件) 的標(biāo)準(zhǔn)來檢測哪些元素應(yīng)當(dāng)包括在內(nèi)。
特別說明,元素不能被禁用(禁用的元素不會被包括在內(nèi))封救,并且元素應(yīng)當(dāng)有含有 name 屬性拇涤。提交按鈕的值也不會被序列化。文件選擇元素的數(shù)據(jù)也不會被序列化誉结。

$(selector).serializeArray()

serialize()

創(chuàng)建以標(biāo)準(zhǔn) URL 編碼表示的文本字符串

$(selector).serialize()  //a=1&b=2&c=3&d=4&e=5

resetForm()

還原表單

$('#form1').resetForm()

clearForm()

清空表單所有元素的值

$('#form1').clearForm()

clearFields()

清空某個表單域的值

$('#form1 :password').clearFields()

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末鹅士,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子惩坑,更是在濱河造成了極大的恐慌掉盅,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,695評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件以舒,死亡現(xiàn)場離奇詭異趾痘,居然都是意外死亡,警方通過查閱死者的電腦和手機蔓钟,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,569評論 3 399
  • 文/潘曉璐 我一進(jìn)店門穗泵,熙熙樓的掌柜王于貴愁眉苦臉地迎上來珠月,“玉大人,你說我怎么就攤上這事》怙保” “怎么了变隔?”我有些...
    開封第一講書人閱讀 168,130評論 0 360
  • 文/不壞的土叔 我叫張陵击困,是天一觀的道長吮蛹。 經(jīng)常有香客問我,道長狭魂,這世上最難降的妖魔是什么罚攀? 我笑而不...
    開封第一講書人閱讀 59,648評論 1 297
  • 正文 為了忘掉前任,我火速辦了婚禮雌澄,結(jié)果婚禮上斋泄,老公的妹妹穿的比我還像新娘。我一直安慰自己镐牺,他們只是感情好炫掐,可當(dāng)我...
    茶點故事閱讀 68,655評論 6 397
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著睬涧,像睡著了一般募胃。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上畦浓,一...
    開封第一講書人閱讀 52,268評論 1 309
  • 那天痹束,我揣著相機與錄音,去河邊找鬼讶请。 笑死祷嘶,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播论巍,決...
    沈念sama閱讀 40,835評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼烛谊,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了嘉汰?” 一聲冷哼從身側(cè)響起丹禀,我...
    開封第一講書人閱讀 39,740評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎郑现,沒想到半個月后湃崩,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體荧降,經(jīng)...
    沈念sama閱讀 46,286評論 1 318
  • 正文 獨居荒郊野嶺守林人離奇死亡接箫,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,375評論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了朵诫。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片辛友。...
    茶點故事閱讀 40,505評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖剪返,靈堂內(nèi)的尸體忽然破棺而出废累,到底是詐尸還是另有隱情,我是刑警寧澤脱盲,帶...
    沈念sama閱讀 36,185評論 5 350
  • 正文 年R本政府宣布邑滨,位于F島的核電站,受9級特大地震影響钱反,放射性物質(zhì)發(fā)生泄漏掖看。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,873評論 3 333
  • 文/蒙蒙 一面哥、第九天 我趴在偏房一處隱蔽的房頂上張望哎壳。 院中可真熱鬧,春花似錦尚卫、人聲如沸归榕。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,357評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽刹泄。三九已至,卻和暖如春怎爵,著一層夾襖步出監(jiān)牢的瞬間特石,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,466評論 1 272
  • 我被黑心中介騙來泰國打工疙咸, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留县匠,地道東北人。 一個月前我還...
    沈念sama閱讀 48,921評論 3 376
  • 正文 我出身青樓,卻偏偏與公主長得像乞旦,于是被迫代替她去往敵國和親贼穆。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,515評論 2 359

推薦閱讀更多精彩內(nèi)容