`

前端知识点补充(常用前端面试题)

 
阅读更多

一:数组去重复(注意数组中有复杂类型的数据)

     简单版本:hash形式

     复杂版本:需要对数据类型进行判断

    如:先判断基本类型(值类型)   undefined|number|string|boolean

           然后判断引用类型: Date,Number,Array,Object,Function,RegExp, JSON等

 

 

二:事件委托

 

某个父类下面有数量庞大的子类节点。

怎么处理在子类节点上的事件

 

事件委托-----addEventListener/attachEvent(ie需要加on);event = event || window.event

 

三:AJAX的几个流程,每个状态代表什么意思

 

属性 描述
onreadystatechange 存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。
readyState

存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

  • 0: 请求未初始化
  • 1: 服务器连接已建立
  • 2: 请求已接收
  • 3: 请求处理中
  • 4: 请求已完成,且响应已就绪
status

200: "OK"

404: 未找到页面

var XMLHttpReq;  
function createXMLHttpRequest() {  
    try {  
        XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");//IE高版本创建XMLHTTP  
    }  
    catch(E) {  
        try {  
            XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");//IE低版本创建XMLHTTP  
        }  
        catch(E) {  
            XMLHttpReq = new XMLHttpRequest();//兼容非IE浏览器,直接创建XMLHTTP对象  
        }  
    }  
  
}  
function sendAjaxRequest(url) {  
    createXMLHttpRequest();                                //创建XMLHttpRequest对象  
    XMLHttpReq.open("post", url, true);  
    XMLHttpReq.onreadystatechange = processResponse; //指定响应函数  
    XMLHttpReq.send(null);  
}  
//回调函数  
function processResponse() {  
    if (XMLHttpReq.readyState == 4 && XMLHttpReq.status == 200 ) {  
       //业务逻辑处理
    }  
  
}  

四:对象深度克隆并且用树状形式打印出来

 


 

 

五:优化网站访问速度的方法。

六:为什么我们要用空函数做继承。

 

var F = function(){};
F.prototype = Parent.prototype;
Son.prototype = new F();//这样只继承父类的原型上的属性和方法,通过for in可以遍历获得父类的属性
Son.prototype.constructor = Son;//指回自己
为什么要这么做?
而不直接
Son.protype = Parent.prototype;
Son.prototype.construtor = Son;
//摘自MSDN
var newObj = Object.create(null, {
            size: {
                value: "large",
                enumerable: true
            },
            shape: {
                value: "round",
                enumerable: true
            }
        });

document.write(newObj.size + "<br/>");
document.write(newObj.shape + "<br/>");
document.write(Object.getPrototypeOf(newObj));

 

七:new  Function()---这货有撒用,什么时候用?

http://davidwalsh.name/new-function  打不开的可以看附件

  1. 1. Creating dynamic functions on the fly.

    You can, for example, let a savvy end-user define script hooks to be executed when
    triggered by an event.

    2. Parsing script without executing it.

    Passing wrong syntax to the Function constructor will throw a syntax error, but
    will not execute it unless you call the resulting function object. (this opposed
    to eval, which will always execute the passed script).

    Building on the example above, you can alert your end-user if his syntax is
    wrong.

    3. and most importantly, you can hide your local variables from the end-user
    script.

    The function objects created by the Function constructor have an empty scope
    chain, and the current closure will not be saved in them.
    Basically, you get nothing but the global object.

    Continuing our example, even script with correct syntax can be problematic.

    for example, consider the following code:

    (function() {
      // my scope
      var a = 'my a';
    
      // test hook
      /* ... */
      // run hook
      new Function("a = 'user a'; var b = 'user b''")();
    
      console.log(a); // 'my a'
      console.log(b); // ReferenceError: b is not defined
      console.log(window.a) // 'user a'
      console.log(window.b) // ReferenceError: b is not defined
    })();
    

    A simple mistake as forgetting a `var` will not cause the outer scope’s
    local variables to change, but instead go directly to the global scope.

    This is why Function(‘return this’)() will return the global object.

    So why don’t we always use the wonderful Function constructor ?
    Because it’s less efficient than declaring functions normally.

    Hope I managed to answer your question.

     
  2. Nir Leibovitch

    @Andrew Gaspar
    while putting the following code into the global scope will work

    (function(global) {
      // global is now the global
    })(this);
    

    Assume that you need the global object in a function within an object (or an object constructor)

    obj = {
      a: function(){
        (function(global){console.log(global)})(this);
      }
    }
    obj.a(); // Object {a: function}
    

    if you use the Function constructor, you can get the global object in this case

    obj = {
      a: function(){
        (function(global){console.log(global)})(Function('return this;')());
      }
    }
    obj.a(); // Window {...}

 

 

分享到:
评论

相关推荐

    个人面试题总结(java,数据库,前端).zip

    文件夹大概有30兆的大小,所以面试题数量也是不少的,里面也包含了个人的一些总结和见解,比如说在集合方面的知识点有实现的各自特点,他们之间的区别,以及等等原理和实现的细节,还包含了java和前端的面试宝典,一...

    2017前端开发最新面试题

    2017年,尽管已是几年前,但那时的前端面试题仍然能反映出当时的主流技术和趋势,对于今天的开发者来说,仍具有相当的学习价值。下面我们将详细探讨这些面试题所涵盖的知识点。 首先,前端开发的基础部分是必不可少...

    前端大厂最新面试题-2020阿里高德前端社招面经.docx

    今天,我将为您讲解前端大厂最新面试题-2020阿里高德前端社招面经.docx这个文件的知识点。这个文件包含了阿里高德前端社招面经的部分内容,涵盖了前端工程师面试的多个方面。 首先,让我们来看一下一面的面试题。第...

    前端面试题含答案.pdf

    前端面试题含答案.pdf 是一份包含多个与前端开发相关的问题的文件,该文件涵盖了 HTML、CSS、JavaScript 等多个方面的知识点。下面是对该文件中部分内容的知识点解释: 1. CSS 样式定义:问题 1 中,讨论了 display...

    2017前端面试题整理汇总

    通过"2017年前端面试题整理汇总100题.pdf"这份资料,你可以系统地复习前端开发的关键知识点,为面试做好充分准备。不断学习和实践这些内容,将有助于提升你的前端开发能力,增加在竞争激烈的市场中脱颖而出的机会。

    前端基础面试题

    前端基础面试题 本资源摘要信息涵盖了前端基础知识点,包括 HTML、CSS 和 JavaScript。下面将对每个知识点进行详细的解释和说明。 1. 将效果生成网页 HTML(HyperText Markup Language,超文本标记语言)是一种...

    前端上机面试题

    根据提供的描述,以下是对这些知识点的详细解释: 1. **数据渲染**: - 使用JavaScript(通常结合HTML和CSS)来动态显示列表数据。这通常涉及到DOM操作,例如使用`innerHTML`或`createDocumentFragment`来添加、...

    前端面试题汇总.pdf

    前端面试题汇总主要涵盖HTML和CSS相关的重要知识点,旨在考察面试者对于网页构建的基础知识、浏览器兼容性、页面性能优化以及SEO策略等的理解。以下是对这些面试题的详细解析: 1. **浏览器测试**:面试者应熟悉...

    96道web前端面试题96道web前端面试题.pdf

    在准备web前端面试时,面试官可能会考察求职者对基础知识的掌握情况以及解决实际问题的能力。以下是根据给定文件内容整理出的知识点: 1. 自我介绍是面试的开场环节,除了基本个人信息外,面试者应该突出自己的技术...

    前端工程师面试题题及答案全面综合.pdf

    前端工程师面试题题及答案全面综合.pdf 文件中包含了多个与前端开发相关的知识点,以下是对这些知识点的详细解释: 1. 要动态改变层中内容可以使用的方法有: innerHTML 属性可以设置或获取 HTML 元素的内容,...

    2023最新前端面试题总结

    "前端面试题总结" 以下是根据给定文件信息生成的相关知识点: 浏览器兼容性 在前端开发中,浏览器兼容性是一个非常重要的问题。不同的浏览器对 HTML、CSS、JavaScript 的解析和执行方式不同,这导致了同一个页面...

    高级前端工程师面试题整理1

    【高级前端工程师面试题整理1】 ... ...- (1) `&lt;canvas&gt;`元素用于图形绘制; - (2) `&lt;video&gt;`和`&lt;audio&gt;`元素支持媒体播放;...这些知识点是现代前端开发中的核心技能,对于构建高性能、跨平台的网页应用至关重要。

    前端面试题大全(40个VUE3.0面试题PDF、CSS、JS、REACT、全栈面经、小程序、性能优化)千道面试题,送前端简历模板

    好的前端面试题可以帮助大家快速就业,单单靠背面试题是错误的想法,要透过面试题真正理解掌握对应的前端知识点才行。本套面试题主要是通过习题让大家真正掌握对应的前端知识点!!! 1 前端知识点分类详细 2 每个...

    2023前端HTML+CSS最全面试题和答案汇总

    内容概要:2023前端HTML+CSS最全面试题汇总,前端知识点全部覆盖,保你面试无忧。在手写Spring 源码的过程中会摘取整体框架中的核心逻辑,简化代码实现过程,保留核心功能,例如:IOC、AOP、Bean生命周期、上下文、...

    前端面试题及答案.pdf

    本文档总结了前端面试题及答案,涵盖了 Vue.js 相关知识点,包括 Vuex 的五个核心概念、Vue 生命周期、Cookie、localStorage 和 sessionStorage 的区别等。 一、Vuex 的五个核心概念 Vuex 是一个专门为 Vue.js ...

    前端面试100题,面试题源代码

    "前端面试100题,面试题源代码"这个资源涵盖了广泛的知识点,旨在帮助应聘者准备全面的面试。这100道题目覆盖了前端开发的核心技术,包括HTML、CSS、JavaScript、浏览器工作原理、网络、性能优化、版本控制、框架和...

    腾讯前端面试题

    在腾讯的前端面试中,面试官可能会关注一系列关键知识点,这些知识点涵盖了前端开发的基础到进阶内容。以下是对这些知识点的详细解释: 1. **JSONP原理**:JSONP(JSON with Padding)是一种解决跨域数据获取的问题...

Global site tag (gtag.js) - Google Analytics