网站建设有什么品牌,网站建设及优化方案,网站域名是啥,网站首页大图怎么做【前端面试】字节跳动2019校招面经 - 前端开发岗#xff08;二#xff09; 因为之前的一篇篇幅有限#xff0c;太长了看着也不舒服#xff0c;所以还是另起一篇吧?一、 jQuery和Vue的区别 jQuery 轻量级Javascript库Vue 渐进式Javascript-MVVM框架jQuery和Vue的对比 jQuer… 【前端面试】字节跳动2019校招面经 - 前端开发岗二 因为之前的一篇篇幅有限太长了看着也不舒服所以还是另起一篇吧? 一、 jQuery和Vue的区别 jQuery 轻量级Javascript库Vue 渐进式Javascript-MVVM框架 jQuery和Vue的对比 jQuery使用了选择器$函数选取DOM对象对其进行赋值、取值、事件绑定等操作和原生的HTML的区别只在于可以更方便的选取和操作DOM对象而数据和界面是在一起的。比如需要获取label标签的内容$(lable).val();,它还是依赖DOM元素的值。Vue通过Vue对象和数据的双向绑定机制将数据和View完全分离开来。在Vue中对数据进行操作不再需要引用相应的DOM对象可以说数据和View是分离的。 再说一些Vue相比jQuery而言所具有的优势 组件化开发提高代码的复用数据和视图分离便于维护和操作虚拟DOM在无需关心DOM操作的基础上依然提供了可靠的性能二、 模拟jQuery的选择器$()实现 源码如下 (function(){jQuery function( selector, context ) {// The jQuery object is actually just the init constructor enhancedreturn new jQuery.fn.init( selector, context, rootjQuery );};if ( typeof window object typeof window.document object ) {window.jQuery window.$ jQuery;}
})(); 最简单的方法 仅仅对于IE8及以上有效 (function(){var jQuery function(selector){return document.querySelectorAll(selector);};window.jQuery window.$ jQuery;
})(); querySelectorAll()返回的是DOM原生element对象而jQuery的选择器返回的是jQuery的包装对象同时包含了原生DOM对象和一些jQuery的构造函数所具有的属性 稍微复杂一点的实现方法 (function(){var jQuery function(selector){var result {};if (selector.substring(0,1) #) {result document.getElementById(selector.substring(1));// this.tqOjbect.data.push(elem);} else if (selector.substring(0,1) .) {result document.getElementsByClassName(selector.substring(1));} else {result document.getElementsByTagName(selector);}return result;};window.jQuery window.$ jQuery;
})(); 三、jQuery的链式调用实现 var MyJQ function(){}
MyJQ.prototype {css:function(){console.log(设置css样式);return this;},show:function(){console.log(将元素显示);return this;},hide:function(){console.log(将元素隐藏);}};
var myjq new MyJQ();
myjq.css().css().show().hide(); 四、网络模型知识