常见前端深度问题

1.数据结构 快速排序的原理,时间复杂度
2.js的事件委托原理、

window.onload = function(){
  var oUl = document.getElementById("ul1");
  oUl.onclick = function(ev){
    var ev = ev || window.event;
    var target = ev.target || ev.srcElement;
    if(target.nodeName.toLowerCase() == ‘li‘){
         alert(123);
        alert(target.innerHTML);
    }
  }
}

-----------------------------------------------------------------
3.事件冒泡和事件捕获的原理及区别
4.on 绑定事件的原理,如何区分触发on事件的是哪个子元素
5.vue的单页面应用,切换到别的路由以后,前一个路由会destroy吗?
6.vue 路由的切换,除了router-link to:以外、

router.push(location)
想要导航到不同的 URL,则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录,所以,当用户点击浏览器后退按钮时,则回到之前的 URL。
router.replace(location)
跟 router.push 很像,唯一的不同就是,它不会向 history 添加新记录,而是跟它的方法名一样 —— 替换掉当前的 history 记录

router.push({path:‘home‘}); //直接添加一个路由,表现切换路由,本质往历史记录里面添加一个
router.replace({path:‘news‘}) //替换路由,不会往历史记录里面添加

---------------------------------------------------------------------------
7.document.ready(function(){})原理

http://wowtianwen.iteye.com/blog/2100913

---------------------------------------------------------------------------
8.jquery组件扩展的$.fn.funName的fn是什么

$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。
如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,那么后面你的每一个jquery实例都可以引用这个方法了.
那么你可以这样子:$("#div").abc();

jQuery为开发插件提拱了两个方法,分别是:

jQuery.extend(object);为扩展jQuery类本身.为类添加新的方法。
jQuery.fn.extend(object);给jQuery对象添加方法。

fn是什么东西呢。查看jQuery代码,就不难发现。

复制代码代码如下:

jQuery.fn = jQuery.prototype ={
   init: function( selector, context ){//.... 
   //......
};

原来 jQuery.fn =jQuery.prototype.对prototype肯定不会陌生啦。
jQuery便是一个封装得非常好的类,比如我们用语句 $("#btn1") 会生成一个 jQuery类的实例。

jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。如:

$.extend({
  add:function(a,b){returna+b;}
});

便为 jQuery 添加一个为add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了,
$.add(3,4); //return 7

jQuery.fn.extend(object);对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。
比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert当前编辑框里的内容。可以这么做:

jQuery代码

$.fn.extend({

alertWhileClick:function(){

$(this).click(function(){

alert($(this).val());
});
}
});

--------------------------------------------------------------------------------------
9.vue的双向数据绑定的原理

数据劫持: vue.js 则是采用数据劫持结合发布者-订阅者模式的方式,
通过Object.defineProperty()来劫持各个属性的setter,getter,
在数据变动时发布消息给订阅者,触发相应的监听回调。

https://segmentfault.com/a/1190000006599500

---------------------------------------------------------------------------------------
10.预加载的原理

时间: 2024-10-11 19:33:31

常见前端深度问题的相关文章

常见前端开发的题目,可能对你有用

1.对WEB标准以及W3C的理解与认识 标签闭合.标签小写.不乱嵌套.提高搜索机器人搜索几率.使用外 链css和js脚本.结构行为表现的分离.文件下载与页面速度更快.内容能被更多的用户所访问.内容能被更广泛的设备所访问.更少的代码和组件,容易维 护.改版方便,不需要变动页面内容.提供打印版本而不需要复制内容.提高网站易用性: 2.xhtml和html有什么区别 HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言最主要的不同:XHTML 元素必须被正确地嵌套.XHTML

常见前端知识摘要

1.this的典型应用(1)在html元素事件属性中使用(2)构造函数里使用(3)input点击,获取值this.value(4)apply/call求数组最值.Math.max.apply(this,numbers)2.闭包的理解:(1)定义和用法:当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数内部的其它变量,如果返回的这个函数在外部被执行,就产生了闭包.(2)表现形式:使函数外部能够调用函数内部定义的变量(3)使用闭包的注意点:一.滥用闭包,会造成内存泄漏:由于闭包会使

vue常见前端UI库

VUE资源汇总:https://github.com/RuMengkai/awesome-vue VUX 项目主页:https://vux.li/#/ github地址:https://github.com/airyland/vux element UI(饿了么后台) Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库. 官网:http://element.eleme.io/#/zh-CN 饿了么github:http://github.com/el

常见前端算法面试题

1.写一个方法将数组换成前端更易解析的树状结构 function getTree(data) {     var newData = [],         hash = {};     for (var i = 0; i < data.length; i++) {         if (!hash[data[i].province]) {             hash[data[i].province] = {                 'province': data[i].pr

常见前端安全

1.跨站脚本攻击,俗称XSS(cross ) 什么是XSS? xss是恶意用户将脚本植入到页面中执行而获取相应敏感信息.也就是会在web页面某个节点(文本节点.属性节点)运行. XSS攻击的危害包括: 1.盗用账号等敏感信息 2.非法转账等 XSS攻击类型: 1.反射型.通过一个伪装的url链接进行攻击,利用url的search参数将脚本伪装,当页面获取链接参数进行攻击 2.储存型.通过表单输入,储存数据库,再在页面读取数据,回显执行脚本进行攻击. 3.富文本. 注入点: 1.html节点内容

多本Web前端深度修炼书籍(提供网盘下载链接)

书籍介绍:这本书涵盖了html5新增标签和功能,而且提供了jquerymobile,Phonegap,Sencha Touch框架的介绍和应用,最后还带了一个移动web应用的样例,绝对是移动web开发的好书! 下载地址: http://pan.baidu.com/s/1gdiwpF1 书籍介绍:这本书为读者系统的规划了javascript的各个知识点,不管各个阶段看这本书都有收获! 下载地址: http://pan.baidu.com/s/1c0nSea8 书籍介绍:这本书基础到深入都讲得非常具

前端深度语句收集

为何组件要从直接产出 html 变成产出 Virtual DOM 呢?其原因是 Virtual DOM 带来了 分层设计,它对渲染过程的抽象,使得框架可以渲染到 web(浏览器) 以外的平台,以及能够实现 SSR 等. 原文地址:https://www.cnblogs.com/bigman-bugman/p/12257594.html

都怪当初看了这6段代码,造成了如今的深度学习!

回忆当初我们看到的这6段代码,造就了我们如今的深度学习,这6段代码的创作者及其取得 的这些辉煌成就的那些故事.这些故事都对应的有简单的代码示例,小伙伴们在FloydHub 和 GitHub 上找到相关代码. 提示一下:要运行 FloydHub 上的代码,需要确保你的电脑上已经安装了Floyd命令工具,并且复制代码保存到本地计算机.在本地计算机示例项目中初始化命令行界面之后,您就可以运行以下命令在 FloydHub 上启动项目: 最小二乘法 所有的深度学习算法都始于下面这个数学公式(我已将其转成

这 6 段代码,成就了如今的深度学习

从代码中追溯深度学习的历史 深度学习发展到如今的地位,离不开下面这 6 段代码.本文介绍了这些代码的创作者及其完成这些突破性成就的故事背景.每个故事都有简单的代码示例,读者们可以在FloydHub和GitHub找到相关代码. Source: Google press image图片来源:Google 新闻图片 python学习交流群:923414804,群内每天分享干货,包括最新的企业级案例学习资料和零基础入门教程,欢迎小伙伴入群学习. 要运行 FloydHub 上的代码示例,请确保您的电脑已经