jQuery之工具方法

jQuer工具方法：
$.type()：与原生js的区别在于原生js的typeof里面的数据是什么类型，type里面的数据到底是什么

console.log(typeof(undefined) + ' - ' + $.type(undefined));         // undefined - undefined
console.log(typeof('abc') + ' - ' + $.type('abc'));                 // string - string
console.log(typeof(123) + ' - ' + $.type(123));                     // number - number
console.log(typeof(true) + ' - ' + $.type(true));                   // boolean - boolean
console.log(typeof(function(){}) + ' - ' + $.type(function(){}));   // function - function
console.log(typeof(null) + ' - ' + $.type(null));                   // object - null
console.log(typeof({}) + ' - ' + $.type({}));                       // object - object
console.log(typeof([1,2,3]) + ' - ' + $.type([1,2,3]));             // object - array
console.log(typeof(new Date()) + ' - ' + $.type(new Date()));       // object - date
console.log(typeof(new Number()) + ' - ' + $.type(new Number()));   // object - number
console.log(typeof(new Person()) + ' - ' + $.type(new Person()));   // object - object
function Person () {}

$ .isArrty()、$ .isFunction() 、$ .isWindow()……：判断是否为数组等

$ .trim()：消除字符串前后空格

$ .proxy()：改变this指向

function show () {
	console.log(this);
}
var obj = {
	name : 'yq',
	age : 18
}
var showProxy = $.proxy(show, obj);
showProxy();   // obj{……}

$ .noConflict()：防止变量（$）命名冲突

var $C = $.noConflict();   // 这个$C就相当于$了

$ .each()循环、$ .map()

var arr = [1,2,3,4];
$.each(arr, function (index, ele) {
	console.log(ele);   // 1 2 3 4
});
var a = $.map(arr, function (index, ele) {
	return ele * index;
});

$ .parseJSON()：原生js为JSON.parse()
属性名必须是双引号形式

$ .makeArray()：传一个类数组，把它转变为数组

var obj = {
	0 : "a",
	1 : "b",
	2 : "c",
	length : 3
}
var arr = [1,2,3,4];
// 一个参数
console.log($.makeArray(obj));   // ["a", "b", "c"]
// 两个参数
console.log($.makeArray("d", obj));   // {0 : "a", 1 : "b", 2 : "c", 3 : "d", length : 4}
console.log($.makeArray(arr, obj));   // {0: "a", 1: "b", 2: "c", 3: "d", 4: 1, 5: 2, 6: 3, 7: 4, length: 8}
console.log($.makeArray(5, arr));     // [1,2,3,4,5]
console.log($.makeArray(obj, arr));   // [1, 2, 3, 4, 5, "a", "b", "c", "d", 1, 2, 3, 4]

*$ .extend()插件扩展(工具方法)
*$ .fn.extend()插件扩展(实例方法)
1.扩展方法（两个的区别所在）
2.浅层克隆
3.深层克隆

// 1.扩展方法
// 加在工具方法里
$.extend({
    definedMandom : function (start, final) {
        var len = final - start;
        return Math.random() * len + start;
    }
});
$.definedMandom(5, 10);   // 返回5 - 10 的随机数

// 加在实例方法里
$.fn.extend({
    drag : function () {
        var disX,
            disY,
            self = this;
        $(this).on('mousedown', function (e) {
            disX = e.pageX - $(this).offset().left;
            disY = e.pageY - $(this).offset().top;

            $(document).on('mousemove', function (e) {
                $(self).css({left:e.pageX - disX, top:e.pageY - disY})
            });
            $(document).on('mouseup', function (e) {
                $(document).off('mousemove').off('mouseup');
            });
        });
        return this;
    }
});
$('.demo').drag();

// 2.浅层克隆
$.extend(obj1, obj2, obj3);   // 把obj2与obj3等的内容克隆到obj1上，obj1里面本来就有就覆盖，没有的就加上

// 3.深层克隆
$.extend(true, obj1, obj2, obj3);