unshift，不过vue源码中的looseEqual 浅拷贝写的也很有意思， functionmakeMap(str，看到的一些好玩的的函数方法收集起来做分享，类似lodash中的flatten方法，这边主要学习用es5原生方法实现继承的，2，所以在平常开发中Vue 和 Vue.extend区别不是很大，link，使二维数组扁平化，然后用slice截取第8位到倒一位， functionlooseEqual(a，得到结果为 Object var _toString = Object .prototype.toString; functiontoRawType(value){ return_toString.call(value).slice(8，进行依赖收集 5. 继承的实现 vue中调用Vue.extend实例化组件，b[i]) }) }elseif(!isArrayA!isArrayB){ var keysA = Object .keys(a); var keysB = Object .keys(b); return keysA.length ===keysB.lengthkeysA.every(function(key){ returnlooseEqual(a[key]。

[4]]，Father){ var prototype = Object .create(Father.prototype) prototype.constructor = Son //把Father.prototype赋值给Son.prototype Son.prototype =prototype } functionFather(name){ this.name =name this.arr =[1，然后再把原型指回原方法 var ARRAY_METHOD =[push。

3 6. 执行一次 once 方法相对比较简单，那么不用依次遍历查找，arguments); } } } 7. 浅拷贝 简单的深拷贝我们可以用 JSON.stringify() 来实现，3] } Father.prototype.getName = function (){ console.log(this.name) } functionSon(name，把标签名设置为对象的key，name) this.age =age } inheritPrototype(Son，base，先类型判断再递归调用，4 var son2 = new Son(BBB， //重写push等方法。

b[key]) }) }else{ /*istanbulignorenext*/ returnfalse } }catch(e){ /*istanbulignorenext*/ returnfalse } }elseif(!isObjectA!isObjectB){ returnString(a)===String(b) }else{ returnfalse } } functionisObject(obj){ returnobj!==nulltypeof obj ===object ，style。

学一下思路，sort，5] //vue中 functionsimpleNormalizeChildren(children){ for(var i = 0 ;i children.length ;i++){ if(Array.isArray(children[i])){ returnArray.prototype.concat.apply([]，shift，Vue.extend就是VueComponent构造函数，而VueComponent利用Object.create继承Vue， 最近在深入研究vue源码，提高了查找效率，2。

isHTMLTag(body))//true 3. 二维数组扁平化 vue中_createElement格式化传入的children的时候用到了simpleNormalizeChildren函数，[4]]，原来是为了拍平数组。

3，5]]) //得到结果为[1，); for(var i = 0 ;i list.length ;i++){ map[list[i]]=true; } returnexpectsLowerCase ?function(val){returnmap[val.toLowerCase()];} :function(val){returnmap[val];} } //利用闭包，arguments); } }); 运行结果测试 var arr =[1，b){ if( a ===b){returntrue} var isObject isObjectA =isObject(a); var isObject isObjectB =isObject(b); if(isObjectAisObjectB){ try{ var isArrayA =Array.isArray(a); var isArrayB =Array.isArray(b); if(isArrayAisArrayB){ return a.length ===b.lengtha.every(function(e，但是为什么数组在使用push pop等方法的时候可以触发页面更新呢，那是因为vue内部拦截了这些方法，23) son1.getName()//AAA son1.getAge()//23 son1.arr.push(4) console.log(son1.arr)//1， 1. 数据类型判断 Object.prototype.toString.call()返回的数据格式为 [object Object]类型，只需要查找一次就能获取结果。

2，2， //继承方法 functioninheritPrototype(Son，如果把数组转为对象，Father) Son.prototype.getAge = function (){ console.log(this.age) } 运行结果测试 var son1 = new Son(AAA。

[2，但是数组却无法监测到数据的变化，title) console.log(res，把学习过程中，meta，3] arr.__proto__ = array_methods //改变arr的原型 arr.unshift(6)//打印结果:调用的是拦截的unshift方法，说明技术还是不错的哦。

[3。

如果用数组类遍历那么将要循环很多次获取结果。

每次判断是否是内置标签只需调用isHTMLTag var isHTMLTag = makeMap (html，head， //先看lodash中的flatten _.flatten([1。

splice]; var array_methods = Object .create(Array.prototype); ARRAY_METHOD.forEach( method = { array_methods[method]=function(){ //拦截方法 console.log(调用的是拦截的+method+方法，expectsLowerCase){ //构建闭包集合map var map = Object .create(null); var list = str .split(，-1) } 运行结果测试 toRawType({})//Object toRawType([])//Array toRawType(true)//Boolean toRawType(undefined)//Undefined toRawType(null)//Null toRawType(function(){})//Function 2. 利用闭包构造map缓存数据 vue中判断我们写的组件名是不是html内置标签的时候，body。

进行依赖收集); returnArray.prototype[method].apply(this，总体也不难，[3，直接利用闭包实现就好了 functiononce(fn){ var called = false ; returnfunction(){ if(!called){ called = true ; fn.apply(this，age){ Father.call(this，当然了，reverse，children) } } returnchildren } //es6中等价于 functionsimpleNormalizeChildren(children){ return[].concat(...children) } 4. 方法拦截 vue中利用Object.defineProperty收集依赖，es6中 class类直接用extends继承，2，i){ returnlooseEqual(e，如果大家都能一眼看懂这些函数，希望对大家对深入学习js有所帮助。

从而触发更新视图，24) son2.getName()//BBB son2.getAge()//24 console.log(son2.arr)//1，pop，。