1沉帮、localStorage、sessionStorage娇澎、cookie 的區(qū)別逐工?
sessionStorage 和 localStorage是HTML5 Web Storage API 提供的,可以方便的在web請(qǐng)求之間保存數(shù)據(jù)铝噩。有了本地?cái)?shù)據(jù)衡蚂,就可以避免數(shù)據(jù)在瀏覽器和服務(wù)器間不必要地來(lái)回傳遞。
sessionStorage、localStorage毛甲、cookie都是在瀏覽器端存儲(chǔ)的數(shù)據(jù)年叮,其中sessionStorage的概念很特別,引入了一個(gè)“瀏覽器窗口”的概念玻募。sessionStorage是在同源的同窗口(或tab)中只损,始終存在的數(shù)據(jù)。也就是說(shuō)只要這個(gè)瀏覽器窗口沒(méi)有關(guān)閉七咧,即使刷新頁(yè)面或進(jìn)入同源另一頁(yè)面跃惫,數(shù)據(jù)仍然存在。關(guān)閉窗口后艾栋,sessionStorage即被銷毀爆存。同時(shí)“獨(dú)立”打開(kāi)的不同窗口,即使是同一頁(yè)面蝗砾,sessionStorage對(duì)象也是不同的先较。
Web Storage帶來(lái)的好處:減少網(wǎng)絡(luò)流量:一旦數(shù)據(jù)保存在本地后,就可以避免再向服務(wù)器請(qǐng)求數(shù)據(jù)悼粮,因此減少不必要的數(shù)據(jù)請(qǐng)求闲勺,減少數(shù)據(jù)在瀏覽器和服務(wù)器間不必要地來(lái)回傳遞】勖ǎ快速顯示數(shù)據(jù):性能好霉翔,從本地讀數(shù)據(jù)比通過(guò)網(wǎng)絡(luò)從服務(wù)器獲得數(shù)據(jù)快得多,本地?cái)?shù)據(jù)可以即時(shí)獲得苞笨。再加上網(wǎng)頁(yè)本身也可以有緩存债朵,因此整個(gè)頁(yè)面和數(shù)據(jù)都在本地的話,可以立即顯示瀑凝。臨時(shí)存儲(chǔ):很多時(shí)候數(shù)據(jù)只需要在用戶瀏覽一組頁(yè)面期間使用序芦,關(guān)閉窗口后數(shù)據(jù)就可以丟棄了,這種情況使用sessionStorage非常方便粤咪。
瀏覽器本地存儲(chǔ)與服務(wù)器端存儲(chǔ)之間的區(qū)別其實(shí)數(shù)據(jù)既可以在瀏覽器本地存儲(chǔ)谚中,也可以在服務(wù)器端存儲(chǔ)。
sessionStorage 寥枝、localStorage 和 cookie 之間的區(qū)別
共同點(diǎn):
都是保存在瀏覽器端宪塔,且同源的。
區(qū)別:
cookie數(shù)據(jù)始終在同源的http請(qǐng)求中攜帶(即使不需要)囊拜,即cookie在瀏覽器和服務(wù)器間來(lái)回傳遞某筐。而sessionStorage和localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器,僅在本地保存南誊。cookie數(shù)據(jù)還有路徑(path)的概念身诺,可以限制cookie只屬于某個(gè)路徑下。存儲(chǔ)大小限制也不同抄囚,cookie數(shù)據(jù)不能超過(guò)4k霉赡,同時(shí)因?yàn)槊看蝖ttp請(qǐng)求都會(huì)攜帶cookie,所以cookie只適合保存很小的數(shù)據(jù)幔托,如會(huì)話標(biāo)識(shí)穴亏。sessionStorage和localStorage 雖然也有存儲(chǔ)大小的限制,但比cookie大得多重挑,可以達(dá)到5M或更大迫肖。
數(shù)據(jù)有效期不同:
sessionStorage:僅在當(dāng)前瀏覽器窗口關(guān)閉前有效,自然也就不可能持久保持.
localStorage:始終有效攒驰,窗口或?yàn)g覽器關(guān)閉也一直保存蟆湖,因此用作持久數(shù)據(jù).
cookie只在設(shè)置的cookie過(guò)期時(shí)間之前一直有效,即使窗口或?yàn)g覽器關(guān)閉玻粪。
作用域不同
sessionStorage不在不同的瀏覽器窗口中共享隅津,即使是同一個(gè)頁(yè)面;localStorage 在所有同源窗口中都是共享的劲室;cookie也是在所有同源窗口中都是共享的伦仍。Web Storage 支持事件通知機(jī)制,可以將數(shù)據(jù)更新的通知發(fā)送給監(jiān)聽(tīng)者很洋。Web Storage 的 api 接口使用更方便充蓝。
.2D 和 3D Transform中的一些用法
CSS3 2D transform特性可以旋轉(zhuǎn)、傾斜喉磁、放大縮小和移動(dòng)元素谓苟,對(duì)網(wǎng)頁(yè)的視覺(jué)觀感上提供很大的幫助
transform: transform-function;
-webkit-transform: transform-function; /* Safari and Chrome */
-moz-transform: transform-function; /* Firefox */
-o-transform: transform-function; /* Opera */
-ms-transform:transform-function; /* IE9以上 */
transform 3D & perspective
CSS3的transform可以做2D的操作,當(dāng)然也有3D
但需要再一個(gè)擁有perspective屬性的父元素才能顯現(xiàn)3D的效果
<div id="div1"><!-- perspective -->
<div id="div2">3D</div><!-- transform -->
</div>
perspective屬性固名思義就是透視的意思协怒;該屬性可以定義3D視覺(jué)的角度涝焙,讓底下子元素使用3D特效時(shí)能夠完整顯示。
perspective使用方法
perspective:150px;
/* 目前并非所有瀏覽器皆支援 */
-webkit-perspective:150px;
-moz-perspective:150px;
另外還有個(gè)屬性叫perspective-origin
功能是用來(lái)定義X和Y軸為基礎(chǔ)的3D位置(定義初始位置)
perspective-origin使用方法:
屬性值:(x軸:left孕暇、center仑撞、right、長(zhǎng)度妖滔、百分比) (y軸:top隧哮、center、bottom座舍、長(zhǎng)度沮翔、百分比)
/* perspective-origin 參數(shù)預(yù)設(shè)是50% 50% */
-webkit-perspective-origin: 40% 60%;/* Safari and Chrome */
-webkit-perspective-origin: 40px 60px;/* Safari and Chrome */
-moz-perspective-origin:left bottombottom; /* Firefox */
注意:perspective和perspective-origin受影響的是子元素,而非元素本身
最后就可以對(duì)div做3D的效果(rotateX和rotateY)
-webkit-transform: rotateX(290deg);
-webkit-transform: rotateY(290deg);
-moz-transform: rotateX(290deg);
-moz-transform: rotateY(290deg);
3簸州、0.1+0.2為什么不等于0.3?如何解決浮點(diǎn)的問(wèn)題鉴竭?了解bignumber.js的浮點(diǎn)數(shù)庫(kù)函數(shù)
console.log(0.1+0.2===0.3); //true or false?
在JavaScript中的二進(jìn)制的浮點(diǎn)數(shù)0.1和0.2并不是十分精確歧譬,在他們相加的結(jié)果并非正好等于0.3岸浑,而是一個(gè)比較接近的數(shù)字 0.30000000000000004 搏存,所以條件判斷結(jié)果為false
如何解決?
怎樣來(lái)解決0.1+0.2等于0.3? 方法是設(shè)置一個(gè)誤差范圍值矢洲,通常稱為”機(jī)器精度“璧眠,而對(duì)于 JavaScript 來(lái)說(shuō),這個(gè)值通常是2^-52,而在 ES6 中读虏,已經(jīng)為我們提供了這樣一個(gè)屬性:Number.EPSILON责静,而這個(gè)值正等于2^-52。這個(gè)值非常非常小盖桥,在底層計(jì)算機(jī)已經(jīng)幫我們運(yùn)算好灾螃,并且無(wú)限接近0,但不等于0,揩徊。這個(gè)時(shí)候我們只要判斷(0.1+0.2)-0.3小于Number.EPSILON腰鬼,在這個(gè)誤差的范圍內(nèi)就可以判定0.1+0.2===0.3為true
bignumber.js的浮點(diǎn)數(shù)庫(kù)函數(shù)
bignumber.js 庫(kù)中提供一個(gè) BigNumber 的構(gòu)造函數(shù),參數(shù)必須是長(zhǎng)度在15位以內(nèi)的數(shù)字塑荒,可以使用2-36進(jìn)制的數(shù)熄赡,超過(guò)36進(jìn)制的也可以,不過(guò)需要自定義字母來(lái)表示了齿税。0-9 加上a-z剛好到36彼硫,所以超過(guò)36就無(wú)法表示了,需要你定義其他的符號(hào)來(lái)表示了凌箕。
x = new BigNumber(1011, 2) // "11"
y = new BigNumber('zz.9', 36) // "1295.25"
z = x.plus(y) // "1306.25"
做小數(shù)運(yùn)算
0.3 - 0.1 // 0.19999999999999998
x = new BigNumber(0.3)
x.minus(0.1) // "0.2"
x // "0.3"
鏈?zhǔn)秸Z(yǔ)法調(diào)用
x.dividedBy(y).plus(z).times(9)
x.times('1.23456780123456789e+9').plus(9876.5432321).dividedBy('4444562598.111772').integerValu
和 js的Number類型類似拧篮,有一些常用的方法:
x = new BigNumber(255.5)
x.toExponential(5) // "2.55500e+2"
x.toFixed(5) // "255.50000"
x.toPrecision(5) // "255.50"
x.toNumber() // 255.5
toString方法
x.toString(16) // "ff.8"
4、
- cd.>cc.txt
- md test
- dir
4.ls -a - cd
- del a.txt
7.dpkg -i /path/to/packagename.deb
5
function foo(x) {
var tmp = 3;
return function (y) {
alert(x + y + (++tmp));
}
}
var bar = foo(2);
bar(10);
在foo中牵舱,聲明一個(gè)變量tmp他托,他屬于foo作用域下的變量德澈。函數(shù)返回一個(gè)函數(shù)滴须,這個(gè)函數(shù)被嵌套棚赔,函數(shù)內(nèi)部彈出x+y(++tmp)
首先執(zhí)行var bar = foo(2)脉幢;那么foo就執(zhí)行了益咬,參數(shù)2也傳進(jìn)去了佳窑,但是執(zhí)行完畢之后单旁,tmp變量以及參數(shù)x就已經(jīng)被釋放回收了嗎墨林?并沒(méi)有腰涧,因?yàn)榉祷刂道锩孢€等待使用這些變量咯韧掩,所以此時(shí),foo雖然執(zhí)行了窖铡,但是foo的變量并沒(méi)有被釋放疗锐,在return在等待繼續(xù)使用這些變量了坊谁,這個(gè)時(shí)候bar就是一個(gè)閉包.然后我們?cè)賵?zhí)行bar,
5滑臊、call口芍、apply、bind的作用是改變函數(shù)運(yùn)行時(shí)this的指向雇卷。
call
call 方法第一個(gè)參數(shù)是要綁定給this的值鬓椭,后面?zhèn)魅氲氖且粋€(gè)參數(shù)列表。當(dāng)?shù)谝粋€(gè)參數(shù)為null关划、undefined的時(shí)候小染,默認(rèn)指向window。
var arr = [1, 2, 3, 89, 46]
var max = Math.max.call(null, arr[0], arr[1], arr[2], arr[3], arr[4])//89
可以這么理解:
obj1.fn()
obj1.fn.call(obj1);
fn1()
fn1.call(null)
f1(f2)
f1.call(null,f2)