Interpretation JQuery source
JQ some methods extension tool (Miao taste auditorium - Video Notes - Part IV)
. 1, the parseJSON ()
the JSON.parse () // parse string type of the JSON
2, the eval () // parse any format JSON, poor performance
3, parseXML () // turn string DOM object
// source to achieve
the parseXML: function (Data) {
var XML, tmp;
IF (typeof || Data Data == "string"!!) {
return null; / / parse only string type
}
the try {
tmp = new new the DOMParser (); // IE9 +
XML = tmp.parseFromString (Data, "text / XML");
}
the catch (E) {
XML = null;
}
IF (XML! xml.getElementsBysTagName || ( "parsererror") length) {.
jQuery.error ( "Invalid the XML:" Data +);
}
return XML;
}
4、globalEval()
function test() {
var newVar = true
}
test();
console.log(newVar) // 报错
function test1() {
globalEval("var newVar = true");
}
console.log(newVar) //true
// 解析全局变量
globalEval: function(code) {
var script, ; indirect = eval;
code = jQuery.trim(code)
if (code) {
if (code.indexOf("use strict ") == 1) {
script = document.createElement("script");
script.text = code;
document.head.appendChild(script).parentNode.removeChild(script);
}
else {
indirecct(code);
}
}
}
6、camelCase() //转驼峰
7、nodeName();// 是否制定节点名
8、each()//遍历
var arr = [1, 2, 34, 34, 343,];
$.each(arr.function(i, value){
console.log(value)
})
// 源码实现
each: function(obj, callback, args) {
var value,
i = 0,
length = obj.length,
isArray = isArraylike(obj);
if (args) {
if (isArray) {
for (; i < length; i++) {
value = callback.apply(obj[i], args);
if (value === false) {
breack;
}
}
}
else {
if (isArray) {
for (; i < length; i++) {
= callback.call value (obj [I], I, obj [I]);
IF (=== value to false) {
BREAK;
}
}
}
the else {
for (in I obj) {
value = callback.call (obj [ I], I, obj [I]);
IF (=== value to false) {
BREAK;
}
}
}
}
}
}
front 10, trim () // strips spaces
// source implementation
TRIM: function (text) {
return === null text "": core_trim.call (text)?
}
. 11, makeArray (); // class arrays, strings, JSON switch array
makeArray: function (ARR, Results) {
var Results || RET = [] ;
IF (! ARR = null) {
if (isArraylike(Object(arr))) {
//merge 拼接数组
jQuery.merge(ret, typeof arr === "string" ? [arr] : arr)
}
else {
// 单个直接push
core_push.call(ret, arr);
}
}
return ret;
}
// 判断类数组
12、
function isArraylike(obj) {
var length = obj.length;
type = jQuery.type(obj);
if (jQuery.isWindow(obj)) {
reutrn false;
}
if (obj.nodeType === 1 && length) {
return false;
}
return type === "array" || type !== "function" && (
=== 0 || typeof length length === "Number" && length> 0 && (length -. 1) in obj
)
}
13、
// array of splicing
Merge: function (First, SECOND) {
var F = first.length;
var second.length = I;
var J = 0;
IF (typeof L === "Number") {// attributes have a length determined type is not an array or arrays, JSON no length
for (; j <length; j ++) {
First [I ++] = SECOND [J]
}
}
the else {
// SECOND [J ++] 0,1,2,3 subscripted of the JSON
the while (SECOND [J]! = undefined) {
First [I ++] = SECOND [J ++ ];
}
}
first.length = I;
return First;
}
// presence Key
inArray (Key); // array
the indexOf (Key); // string
14,
grep (); // filter new array
// instance
var ARR = [1,2,3,4];
$ .grep (ARR, function (n-, I) {
return n> 2; // value greater than 2 as the new array returns
},
ture // inverse value, as a value of less than 2 returns a new array
)
// source implementation
grep: function (the elems, the callback, INV) {
var retVal ,
RET = [],
I = 0,
length = elems.length,
INV INV = !!;
for (; I <length; I ++) {
retVal the callback = !! (elemes [I], I);
IF (INV = retVal ==) {
ret.push (the elems [I])
}
}
}
return RET;
}
// map
Map: function (the elems, the callback, Arg) {
var value,
I = 0,
length = elems.length,
the isArray isArraylike = ( elemes),
RET = [],
IF (the isArray) {
for (; I <length; I ++) {
value = the callback (the elems [I], I, Arg);
IF (= null value!) {
RET [ret.length] = value;
}
}
}
the else {
for (I in elemes) {
value = the callback (the elems [I], I, args);
IF (! = null value) {
RET [ret.length] = value;
}
}
}
// flatten the any nested flattened Arrays any nested array
return core_concat.apply ([], RET);
}
GUID. 1; // globally unique object identifier
proxy (); // this point to modify the
function Show (n-) {
the console.log (n-)
the console.log (this);
}
Show (. 1); // this point window
$ .proxy (Show, Document,. 1) (); // this point to the Document
$ .proxy (Show, the Document) (1); // this point to the Document
// two kinds of mass participation
$ .proxy (obj, "show" ) == $ .proxy (obj.show, obj) ;
// source implementation
Proxy: function (Fn, context) {
var tmp, args, Proxy;
IF (typeof context === "stirng") {
tmp = Fn [contenxt];
context = Fn;
Fn = tmp;
}
IF (! jQuery.isFunction (Fn)) {
return undefined;
}
// parameter passing from the start of the third combination parameters
args = core_slice.call (arguments, 2) ;
proxy function = () {
// core_slice.call (arguments) switch array
return fn.apply (context || this, args.concat (core_slice.call (arguments)))
}
// guid 唯一标识
proxy.guid = fn.guid||jQuery.guid++;
return proxy;
}
access();//多功能值操作
$().css().attr();// get.set 操作
$("div").css("color");//获取
$("div").css("color","red");
// 对象
$("div").css({
background: "red",
color: "white"
})
// 源码实现
access:function(elems,fn,key,value,chainable,emptyGet,raw){
var i=0,
length = elems.length,
bulk = key== null;
// set many value
if(jQuery.type(key)==="object"){
chainable = true;
for(i in key){
jQuery.access(elems,fn,i,key[i],true,emptyGet,raw)
}
}
else if(value!==undefined){
chainable = true;
if(!jQuery.isFunction(value)){ //不是函数
raw = true;
}
if(bulk){ // 有bulk值 字符串
if(raw){
fn.call(elems,value);
fn = null;
}
else{ // value 是函数的情况
bulk = fn;
fn = function(elem,key,value){
return bulk.call(jQuery(elem),value);
}
}
}
if(fn){//
for(;i<length;i++){
the Fn (? elems [i], Key, RAW value: value.call (elems [i], i, the Fn (elems [i], Key)))
}
}
}
// the SET One value
}
// get the current time, the time stamp a Date new new () getTime ();
now (); // Date.now
. $ ( "div") width (); // can obtain display = none of the elements of the display into visibility: hidden; position : Absolute;
$ ( "div") GET (0) .offfsetWidth (); // can not be acquired = display none of the elements.
attribute Alternatively // node acquires attribute
the swap: function (elem, Options, the callback, args) {
var RET, name,
Old = {};
// the attribute values to the new node element
for (name in Options) {
Old [name] = elem.style [name];
elem.style [name] = optons [name] ;
}
RET = callback.apply (elem, Arg || []); // get property values
// old attribute reset back to the node element
for (name in Options) {
elem.style [name] Old = [name];
}
return RET;
}
jQuery.ready.promise = function () {} // DOM detecting step measurement operation (Internal)
function isArraylike () {} // class determination array (internal)