1. 程式人生 > 實用技巧 >前端知識

前端知識

1.資料型別

String Number Boolean Object NullUndefinedSymbol(es6)

2.深拷貝和淺拷貝

淺拷貝:建立一個新的物件 將原有的物件屬性值完整的拷貝過來,包括原始的型別值和引用型別的記憶體地址 只拷貝第一層

const obj2 = Object.assign({}, obj);

深拷貝:拷貝所有的屬性值,以及屬性地址指向的值的記憶體空間

JSON.parse(JSON.stringify(obj))是最簡單粗暴的深拷貝

lodash中的_.clone(obj, true)等價於_.cloneDeep(obj)兩個方法

3.陣列的常用方法

concat pop() push() join() split() map() foreach() filter() reduce() some() every()

4.this的問題

可以理解為誰呼叫指向誰

5.call apply bind

都能改變this指向,

第一個引數都是指向的this,

bind返回函式需要bind()呼叫 call第二個引數以此逗號隔開, applay第二個引數放在一個數組

6.防抖和節流

防抖: 當持續觸發事件時,一定時間段內沒有再觸發事件,事件處理函式才會執行一次,如果設定的時間到來之前,又一次觸發了事件,就重新開始延時

function debounce(fn,delay){
    let timer = null;
    return function(){
        if (timer) {
            clearTimeout(timer)
        } 
        setTimeout(fn, delay)
    }
}

節流:使得一定時間內只觸發一次函式。原理是通過判斷是否到達一定時間來觸發函式

function throttle (fn,delay){
    var timer = null;
    var pre = Date.now();
    return function(){
        var ctx = this;
        var next = Date.now();
        if(next-pre >= delay){
            fn.applay(ctx,arguments)
            pre = Date.now()
        }
else{ timer = setTimeout(fn, delay) } } }

7.Object.defineProperty()中get和set

var _nv;
var v = {}

Object.defineProperty(v,'11',{
    get:function(){
        return _nv
    },
    set:function(nv){
        _nv = nv
    }
})