[jQuery原理] jQuery原型上的属性和方法

jQuery原型上的核心方法和属性：

• 属性
  • jquery 获取jQ版本号
  • selector 实例默认的选择器取值
  • length 实例默认的长度
  • push 给实例添加新元素
  • sort 对实例中的元素进行排序
  • splice 按照指定下标指定数量删除元素，也可以替换删除的元素
• 方法
  • toArray 把实例转换为数组返回
  • get 获取指定下标的元素，获取的是原生DOM
  • eq 获取指定下标的元素，获取的是jQuery类型的实例对象
  • first 获取实例中的第一个元素，是jQuery类型的实例对象
  • last 获取实例中的最后一个元素，是jQuery类型的实例对象
  • each 遍历实例，把遍历到的数据传给回调使用
  • map 遍历实例，把遍历到的数据传给回调使用，然后把回调的返回值收集起来组成一个新的数组返回

 
 

toArray

var res = $("div");
console.log(res);
//伪数组转换为真数组
var res2 = res.toArray();
console.log(res2);


toArray: function () {
	return [].slice.call(this);
},

 

get

var res = $("div");
console.log(res);
get方法如果不传递参数, 相当于调用toArray()
console.log(res.get());
console.log(res.get(0));
console.log(res.get(1));
console.log(res.get(-1)); // (3 + -1) = 2
console.log(res.get(-2)); // (3 + -2) = 1


get: function (num) {
	// 没有传递参数
	if(arguments.length === 0){
		return this.toArray();
	}
	// 传递不是负数
	else if(num >= 0){
		return this[num];
	}
	// 传递负数
	else{
		return this[this.length + num];
	}
},

 

eq

var res = $("div");
console.log(res.eq());
console.log(res.eq(0));
console.log(res.eq(-1));


eq: function (num) {
	// 没有传递参数
	if(arguments.length === 0){
		return new njQuery();
	}else{
	//传递负数或者非负数
		return njQuery(this.get(num));
	}
},

 

first、last

var res = $("div");
console.log(res.first());
console.log(res.last());


first: function () {
	return this.eq(0);
},
last: function () {
	return this.eq(-1);
},

 

each

var arr = [1, 3, 5, 7, 9];
var obj1 = {0:"lnj",1:"333",2:"male",length:3};
var obj2 = {"name":"lnj","age":"33"};

njQuery.each(arr, function (key, value) {
	if(key === 2){
		return false;
	}
	console.log(key, value);
	console.log(this);
	});
	jQuery.each(arr, function (key, value) {
		console.log(key, value);
		console.log(this);
});

$(arr).each(function (key, value) {
	console.log(key, value);
	console.log(this);
});



each: function (fn) {
	return njQuery.each(this, fn);
}
each: function (obj, fn) {
	// 1.判断是否是数组
	if(njQuery.isArray(obj)){
		for(var i = 0; i < obj.length; i++){
			// var res = fn(i, obj[i]);
			var res = fn.call(obj[i], i, obj[i]);
			if(res === true){
				continue;
			}else if(res === false){
				break;
			}
		}
	}
	// 2.判断是否是对象
	else if(njQuery.isObject(obj)){
		for(var key in obj){
			// var res = fn(key, obj[key]);
			var res = fn.call(obj[key], key, obj[key]);
			if(res === true){
					continue;
			}else if(res === false){
				break;
			}
		}
	}
	return obj;
},

 

map

var arr = [1, 3, 5, 7, 9];
var obj1 = {0:"lnj",1:"333",2:"male",length:3};
var obj2 = {"name":"lnj","age":"33"};
var res = njQuery.map(arr, function (value, key) {
	// console.log(value, key);
	if(key === 2){
		return value;
	}
});
console.log(res);



map: function (obj, fn) {
	var res = [];
	// 1.判断是否是数组
	if(njQuery.isArray(obj)){
		for(var i = 0; i < obj.length; i++){
			var temp = fn(obj[i], i);
			if(temp){
				res.push(temp);
			}
		}
	}
	// 2.判断是否是对象
	else if(njQuery.isObject(obj)){
		for(var key in obj){
			var temp =fn(obj[key], key);
			if(temp){
				res.push(temp);
			}
		}
	}
	return res;
}