-
scrollWidth,ClientWidth,OffsetWidth差異
- scrollWidth 容器內容寬度 ->容器內部的內容最大能把容器撐多大就是它的scroll尺寸,如果沒撐開則是容器的寬度
- ClientWidth 容器的寬度 ->不包含border
- OffsetWidth 容器樣式寬高 ->包括border
- window.innerWidth 瀏覽器窗口內顯示區的寬度(只讀)
-
screenX,pageX,clientX差異
- 注意pageX,clientX都是以瀏覽器做參照物的,和父容器沒關系。screenX是以屏幕做參照物的。
function getX(e) {
// 距離瀏覽器左邊的距離 包含滾動隱藏的距離
console.log(e.pageX);
// 距離屏幕左邊的距離
console.log(e.screenX);
// 距離瀏覽器左邊的距離 不包含滾動隱藏的距離
console.log(e.clientX);
}
```
-
判斷字符串是數字還是字符串
var str = "abc";
+abc //NaN
str = "123"
+str = 123; -
原型角度,vue的雙向數據綁定原理
柯里化是什么,用處?
-
自己實現一個柯里化處理函數
const currying = function (fn) { const argsLen = fn.length; const args = []; const curryN = function () { [].push.apply(args,[].slice.call(arguments)); if(args.length >= argsLen){ return fn.apply(null,args.slice(0,argsLen)); }else{ return curryN; } }; return curryN;
};
const g = currying(function (a,b,c) {
console.log(a,b,c);
});
g(2)(3)(4,5); //2,3,4
```
- 用處:
- 延遲計算
```javascript
const g = currying(function (a,b,c) {
return a+b+c;
});
console.log(g(2)(3)(5));//10
```
- 參數復用
```javascript
var addEvent = currying(function(window,el,sType,fn,capture){
if (window.addEventListener) {
el.addEventListener(sType, function(e) {
fn.call(el, e);
}, (capture));
} else if (window.attachEvent) {
el.attachEvent("on" + sType, function(e) {
fn.call(el, e);
});
}
});
// 兼容模式的添加函數
var addCompatibleEvent = addEvent(window);
addCompatibleEvent(document.querySelector("#app"),"click",function (e) {
console.log(e);
},false);
```
柯里化(Currying),又稱部分求值(Partial Evaluation),是把接受多個參數的函數變換成接受一個單一參數(最初函數的第一個參數)的函數,并且返回接受余下的參數而且返回結果的新函數的技術。
- 數組方法
- push,pop,shift,unshift都是作用在當前數組上的,concat是處理后返回一個新數組.