jQuery中extend的用法

jQuery中extend有三種用法

用法一：給jQuery類添加方法

$.extend({
    show:function(){
        console.log('I will show this string')
    }
})
$.show() // I will show this string複製代碼

用法二：給Jquery的原型添加方法，調用添加的方法時須要獲取Jquery實例

<div class="test"></div>
$.fn.extend({
    show:function(){
        console.log('I will show this string')
    }
})
$('.test').show() // I will show this string複製代碼

用法三：繼承、淺拷貝和深拷貝

1.淺拷貝

var a = {}
var b = {'name':'zhangsan'}
$.extend(a,b)
console.log(a.name) // zhangsan複製代碼

若是b這個對象中嵌套對象，那麼改變a後，b會跟着改變

var a = {}
var b = {'people': {'name': 'lisi'}}
$.extend(a,b)
a.people.name = 'wangwu'
console.log(b.people.name) // wangwu複製代碼

此時，b中的name改變了，碰到這種狀況，咱們須要進行深拷貝

2.深拷貝

var a = {}
var b = {'people': {'name': 'lisi'}}
$.extend(true,a,b)
a.people.name = 'wangwu'
console.log(b.people.name) // lisi複製代碼

3.繼承，不管後面跟多少個對象，都將成爲第一個對象的屬性

var a = {'sex': '1'}
$.extend(a,{'name':'zhangsan'},{'people':{'name':'lisi'}})
console.log(a) // {sex: "1", name: "zhangsan", people: {'name':'lisi'}}複製代碼