jQuery不过如此

首先要理解,JavaScript的语法是需要引擎来实现的.引擎是用其他语言写的(一般是c或者java).因为JavaScript语言在浏览器中已经实现了.所以可以用JavaScript写API; API就是给别人用的代码,可以说是工具,JavaScript实现这种工具一般就是用函数(可以执行代码的对象就是函数,对象就是基本类型的集合,因为数据结构不同,具体区分了单纯对象+函数+数组)

这堂课是要通过实现类似jQuery的函数库,来体会jQuery究竟是什么东西.首先就来,封装一个函数体验一下

通常来说，使用nodeType属性确定一个节点的类型，比较方便
document.querySelector('a').nodeType === 1
Node.nodeValue属性返回一个字符串，表示当前节点本身的文本值，该属性可读写。
Node.textContent属性返回当前节点和它的所有后代节点的文本内容。textContent属性自动忽略当前节点内部的HTML标签，返回所有文本内容。
属性和方法的区别在于,函数属性就是方法,因为函数可以返回一个东西.
阮一峰,jquery设计思想
库是什么呢?库是特定种类的API //全球浏览器使用量登录builtwith查看

自己写,就懂什么是jQuery了//代码如下

var allChild = itme3.parentNode.children
var array= {length:0}
for(let i=0;i<allchild.length,i++){
if (allChild[i]!==item3){
array[array.length]=allChild[i]
array.length+=1
}
}
这是实现一个伪数组的代码.伪数组就是hash;

然后给他封装,也就是写个函数取个名字呗~~~~~
具体实现获取一个元素所有兄弟的代码如下::::::::

function 获取所有兄弟(node){
          var allChild =node.parentNode.children
          var array= {length:0}
      for(let i=0;i<allchild.length,i++){
                    if (allChild[i]!==node){
                           array[array.length]=allChild[i]
                          array.length+=1     
                    }
                    return array
          }
}// 这样就通过代码封装出一个'获取所有兄弟'的API了

现在来写第二个,添加多个class的API

var classes = { 'a':true,'b':false,'c':true}
for ( let key in classes){
var value = classes[key]
if ( value) {
item3.classList.add(key)
} else{
item3.classList.remove(key)
}
}
//// 我们来封装一下,把他放进一个函数里面,让别人使用// 这个过程中就要考虑到多个问题了,首先要处理的对象要被人给,所以留出参数给别人使用,也就意味着不能写死代码.
function addClass(node,classes){
for(let key in classes){
var value = classes[key]
if(value){
node.classList.add(key)
}else{
node.classList.remove(key)
}
}
}

写了两个API 那么就来优化一下,体验整个过程

代码优化守则第一个: 有类似的代码就存在优化的可能//我们来优化上面的代码

function addClass(node,classes){
for( let key in classes){
var value = classes[key]
var methodName = value ? 'add':'remove'
node.calssListmethodName
}
}// 这不单可以加calss,还可以减class要是简单实现加,那么使用以下代码,更简单

function addClass(node,classes){
classes.forEach((value)=>node.classList.add(value))
}

接下来讲命名空间//程序员觉得一个东西好就会娶个专业名词~_{因为代码是开源的,你可以写组件,别人也写了组件,那么在使用的时候,你要区分开来,当然最直观的是靠名字来区分啦}~~所谓的命名空间,一个是彰显自己的牛逼,还有就是区分不同人写的不同组件,模块

//真实的意义:

如果没有命名空间,别人就不知道你的库叫什么
如果没有命名空间,你会不知不觉把所有全局变量覆盖了,比如说,你要在一家公司做前端,之前的员工肯定写了属于他自己的库,他的函数库有很多的不知名字的函数可以调用,可是不知道他都写了哪些API,就算有名字你也记不全,那么工作的时候,你觉得自己的API好用,又写了,因为功能相似,名字恰巧又一样了.完了~~~~你的API是不是把别人的给覆盖了? 那么之前经他手的代码是不是都出问题了,因为通用的函数名,让你给覆盖了.
Windows.jasonDom = {}
jasonDom. getSiblings = getSliblings

原型链其实就是公有属性链:Element_proto_ === Node.prototype(//这就是公有属性)

那么久出现一个问题:A 好用还是B好用呢?当然是B好用啊!!! 如何实现呢?有两个办法,第一个是修改原型代码,也就是修改原型链的顶端代码; 另外一个就是用this

调用函数一般就是简单加个(),就可以了,这种方式的this是隐式的,谁调用就是this;另外一种就是用call()来调用函数,这种是明确指定this的.

item3.getSiblings.call(item3)// 等价于item3.getSiblings

this;使用闭包的目的——隐藏变量;所以函数套函数只是为了造出一个局部变量，跟闭包无关。

关于闭包的谣言

闭包会造成内存泄露？

错。

说这话的人根本不知道什么是内存泄露。内存泄露是指你用不到（访问不到）的变量，依然占居着内存空间，不能被再次利用起来。

闭包里面的变量明明就是我们需要的变量（lives），凭什么说是内存泄露？

这个谣言是如何来的？

因为 IE。IE 有 bug，IE 在我们使用完闭包之后，依然回收不了闭包里面引用的变量。

这是 IE 的问题，不是闭包的问题。参见司徒正美的这篇文章。

1.可以访问其他函数内变量的函数，叫做闭包。
2.闭包可以用来保存一个需要持久保存的变量，可以模拟命名空间。

this详细文章请看方老师的文章

总结:

this 就是你 call 一个函数时，传入的 context。
如果你的函数调用形式不是 call 形式，请按照「转换代码」将其转换为 call 形式。以后你遇到所有跟 this 有关的笔试题，都不会有疑问了。

上面对this的阐述是不完整的,因为根据上面所有,那么调用API的时候,由于API是浏览器预先封装好的,源代码也看不见,鬼知道谁调用了函数~~~~这也是个大问题

总结一下如何确定 this 是值
看源码中对应的函数是怎么被 call 的（这是最靠谱的办法）
看文档
console.log(this)
不要瞎猜，你猜不到的

前面提到可以修改Node的原型属性,来实现新的方法属性,但是这种做法是很不规范的,因为要是有人已经改写了同名函数,你又去改写,是不是把他给覆盖了,这是很不负责任的做法.所以我们只能选择第二种方法,重新写一个Node2属性//代码如下

window.Node2 = function (node){
return {
getSilbings:function(){},
addClass:function(){}
}
}
var node2 Node2(item3)
node2.getSiblings()
node2.addClass()

也就是说,jQuery实质上是一个构造函数,接受一个参数,这个参数可能是节点,然后返回一个方法对象去操作节点~_{这就是本质}~!!!!! 一百分

闭包不是JavaScript可以造出来的,是因为函数的作用域的特性衍生出来的一种情况.

也就是一个函数,调用了外部环境变量的一个变量// 也就是说穿越时空了~~~;这个变量,和这个函数统称为闭包
闭包的作用就是隐藏变量,避免被错误调用