前端面试知识点:跨域、this、事件委托

需积分: 0 14 下载量 153 浏览量 更新于2024-07-17 5 收藏 297KB DOCX 举报
"这份文档包含了2019年上半年的前端面试题目,主要针对初级和中级开发者,涵盖了前端开发中的常见问题,如解决跨域、this的指向、事件委托代理、浏览器工作原理等,并对比了Mvc和MVVM的区别。" 本文档详细列举了一些前端面试中常见的技术问题,以下是对这些知识点的深入解释: 1. 解决跨域问题: 跨域是由于浏览器的同源策略限制,使得不同源的HTTP请求无法直接交互。JSONP(JSON with Padding)是一种绕过同源策略的方法,通过动态插入`<script>`标签来实现。服务器端返回一段JavaScript函数调用,包含要传递的数据,客户端通过预先定义好的函数来接收数据。 2. Header设置允许跨域: 使用PHP等后端语言,可以通过设置HTTP响应头`Access-Control-Allow-Origin`来允许跨域访问。例如: ```php Header('Access-Control-Allow-Origin:*'); // 允许所有来源访问 Header('Access-Control-Allow-Methods:POST,GET'); // 允许POST和GET方法 ``` 3. this的指向: - 普通函数中的`this`默认指向全局对象,在浏览器环境下就是`window`。 - 对象方法调用时,`this`指向调用该方法的对象。 - 构造函数中的`this`指向新创建的对象实例。 - `call()`, `apply()`, `bind()`可以显式改变`this`的指向。 4. new操作符的工作原理: - 创建一个新的对象。 - 将构造函数的作用域赋值给新对象,此时`this`指向新对象。 - 执行构造函数的代码,为新对象添加属性。 - 返回新对象。 5. 事件委托代理: 事件委托是基于事件冒泡原理,将事件绑定到父元素上,由父元素监听子元素的事件,以提高性能和减少内存消耗。 6. 浏览器处理URL请求的过程: - DNS解析:查找URL对应的IP地址。 - TCP三次握手建立连接:同步报文、同步应答和确认应答交互。 - 发送HTTP GET请求,服务器响应并返回资源。 7. 箭头函数的替代方案: 在不适合使用箭头函数的情况,可以使用传统的函数表达式,如定义对象方法、原型方法、构造函数或事件回调函数。 8. 强制转换与隐式转换: - 强制转换:通过`String()`, `Number()`, `Boolean()`等函数将变量转换为特定类型。 - 隐式转换:在运算或比较时自动进行,如`typeof`用于检测变量类型,类型转换也发生在不同类型的变量进行操作时。 9. ==与===的区别: - `==`只比较值,会进行类型转换,可能导致预期之外的结果。 - `===`既比较值又比较类型,不会进行类型转换,更严格。 10. MVC与MVVM的区别: - MVC(Model-View-Controller)中,View可以直接访问Model,Controller负责Model与View的交互。 - MVVM(Model-View-ViewModel)模式中,ViewModel作为Model和View的中间层,它监听Model的变化并更新View,同时也响应View的交互来更新Model,实现了数据双向绑定。 以上知识点是前端开发中基础且重要的部分,理解和掌握这些内容对于提升开发者的技术水平和面试准备非常有帮助。
2018-12-28 上传
一、单选题(每题2分,共10分) 1、以下哪一个是html5的dtd A <!DOCTYPE html> B <!DOCTYPE HTML PUBLIC> C <!DOCTYPE xhtml> D <!DOCTYPE html5> 2、以下全部属于块级标签的是 A

<input><span> B