最全前端面试集合 (1)

javascript对象的几种创建方式

1,工厂模式

2,构造函数模式

3,原型模式

4,混合构造函数和原型模式

5,动态原型模式

6,寄生构造函数模式

7,稳妥构造函数模式

下载资源:www.yinxiangit.com

javascript继承的6种方法

1,原型链继承

2,借用构造函数继承

3,组合继承(原型+借用构造)

4,原型式继承

5,寄生式继承

6,寄生组合式继承


异步加载和延迟加载

1.异步加载的方案: 动态插入script标签
2.通过ajax去获取js代码,然后通过eval执行
3.script标签上添加defer或者async属性
4.创建并插入iframe,让它异步执行js
 5.延迟加载:有些 js 代码并不是页面初始化的时候就立刻需要的,而稍后的某些情况才需要的。

请解释一下 JavaScript 的同源策略。

概念:同源策略是客户端脚本(尤其是Javascript)的重要的安全度量标准。它最早出自Netscape Navigator2.0,其目的是防止某个文档或脚本从多个不同源装载。

这里的同源策略指的是:协议,域名,端口相同,同源策略是一种安全协议。

指一段脚本只能读取来自同一来源的窗口和文档的属性。

为什么要有同源限制?

我们举例说明:比如一个黑客程序,他利用Iframe把真正的银行登录页面嵌到他的页面上,当你使用真实的用户名,密码登录时,他的页面就可以通过Javascript读取到你的表单中input中的内容,这样用户名,密码就轻松到手了。

缺点:

现在网站的JS 都会进行压缩,一些文件用了严格模式,而另一些没有。这时这些本来是严格模式的文件,被 merge 后,这个串就到了文件的中间,不仅没有指示严格模式,反而在压缩后浪费了字节。

GET和POST的区别,何时使用POST?
GET:一般用于信息获取,使用URL传递参数,对所发送信息的数量也有限制,一般在2000个字符    
POST:一般用于修改服务器上的资源,对所发送的信息没有限制。    
GET方式需要使用Request.QueryString来取得变量的值,而POST方式通过Request.Form来获取变量的值,也就是说Get是通过地址栏来传值,而Post是通过提交表单来传值。
然而,在以下情况中,请使用 POST 请求:无法使用缓存文件(更新服务器上的文件或数据库)向服务器发送大量数据(POST 没有数据量限制)
发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠。

zepto和jq的区别

相同点:

zepto是jQuery的轻量级替代品。API相似。在jQuery中常用的API和方法zepto中也有。zepto中还有些jQuery中没有的。1.zepto文件比jQuery文件小,轻量级的,一共才8k多。

不同点:

1.针对移动端程序:zepto不支持IE浏览器,也就是说IE还是可以使用jQuery,而其他浏览器也可以使用zepto在文件大小上带来的优势。但是它们两个的API不是完全兼容的。所以使用上还是用小心。

2.DOM操作上的区别:添加id时jQuery不会生效而zepto会。

3.事件触发的区别:jQuery中load事件的处理函数不会执行;zepto的会执行。

4.事件委托的区别:Zepto中,document上所有的click委托事件都依次放入到一个队列中,依次执行。而在jQuery中,document上委托了多个click事件,点击后通过选择符进行匹配,执行相应元素的委托事件。

5,width()和height()的区别:Zepto由盒模型(box-sizing)决定,用.width()返回赋值的width,用.css(‘width’)返回加border等的结果;jQuery会忽略盒模型,始终返回内容区域的宽/高(不包含padding、border)。

6,offset()的区别:Zepto返回{top,left,width,height};jQuery返回{width,height}。

7,Zepto无法获取隐藏元素宽高,jQuery 可以。

8,Zepto中没有为原型定义extend方法而jQuery有。

9,Zepto 的each 方法只能遍历 数组,不能遍历JSON对象。

10,Zepto在操作dom的selected和checked属性时尽量使用prop方法,在读取属性值的情况下优先于attr。Zepto获取select元素的选中option不能用类似jQuery的方法$(‘option[selected]’),因为selected属性不是css的标准属性。应该使用$(‘option’).not(function(){ return !this.selected })。

MVVM面试:

1.问:什么是MVVM?

答:视图模型双向绑定,Model-View-ViewModel的简写。

当数据模型更改的时候会自动反映到视图上,同时如果视图发生了改变,也会同样的反映到数据模型中。

2.问:MVVM的优点 ?

答:1. 低耦合。视图(View)可以独立于Model变化和修改,一个Model可以绑定到不同的”View”上,当View变化的时候Model可以不变,当Model变化的时候View也可以不变。

2. 可重用性。你可以把一些视图逻辑放在一个Model里面,让很多view重用这段视图逻辑。

3. 独立开发。开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计。

4. 可测试。

3.问:自己如何实现MVVM框架?

4.问:自己如何实现MVVM框架 ?

答:Observer(数据监听模块)里面重新覆盖了object对象的get和set方法,用来监视数据模型的改变,同时反映到视图中。 Parser(解析器)用来监听视图的变化,同时将视图的改变反映到数据模型中。

socket

网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为一个socket。

建立网络通信连接至少要一对端口号(socket)。socket本质是编程接口(API),对TCP/IP的封装,TCP/IP也要提供可供程序员做网络开发所用的接口,这就是Socket编程接口;HTTP是轿车,提供了封装或者显示数据的具体形式;Socket是发动机,提供了网络通信的能力。

Socket的英文原义是“孔”或“插座”。作为BSD UNIX的进程通信机制,取后一种意思。通常也称作”套接字”,用于描述IP地址和端口,是一个通信链的句柄,可以用来实现不同虚拟机或不同计算机之间的通信。在Internet上的主机一般运行了多个服务软件,同时提供几种服务。每种服务都打开一个Socket,并绑定到一个端口上,不同的端口对应于不同的服务。Socket正如其英文原意那样,像一个多孔插座。一台主机犹如布满各种插座的房间,每个插座有一个编号,有的插座提供220伏交流电, 有的提供110伏交流电,有的则提供有线电视节目。 客户软件将插头插到不同编号的插座,就可以得到不同的服务。

websocket

WebSocket协议是基于TCP的一种新的网络协议。它实现了浏览器与服务器全双工(full-duplex)通信——可以通俗的解释为服务器主动发送信息给客户端。

WebSocket首次在HTML5规范中被引用为TCP连接,作为基于TCP的套接字API的占位符。[1]  WebSocket通信协议于2011年被IETF定为标准RFC 6455,并被RFC7936所补充规范

什么是WebSocket API?

WebSocket API是下一代客户端-服务器的异步通信方法。该通信取代了单个的TCP套接字,使用ws或wss协议,可用于任意的客户端和服务器程序。WebSocket目前由W3C进行标准化。WebSocket已经受到Firefox 4、Chrome 4、Opera 10.70以及Safari 5等浏览器的支持。

WebSocket API最伟大之处在于服务器和客户端可以在给定的时间范围内的任意时刻,相互推送信息。WebSocket并不限于以Ajax(或XHR)方式通信,因为Ajax技术需要客户端发起请求,而WebSocket服务器和客户端可以彼此相互推送信息;XHR受到域的限制,而WebSocket允许跨域通信。

Ajax技术很聪明的一点是没有设计要使用的方式。WebSocket为指定目标创建,用于双向推送消息。

原文地址:https://www.cnblogs.com/bingerger/p/11516816.html

时间: 2024-10-09 15:30:55

最全前端面试集合 (1)的相关文章

最全前端面试集合(4)总结篇

面试时注意: 自我介绍不能太长,也不能过短,3分钟左右最合适,尤其做为web前端技术 方面的面试,更加要说到点上,我依次从学习方面.项目实践.未来规划这 三个方面写下web前端面试的自我介绍. 下载资源:https://www.yinxiangit.com 前端开发面试全面知识大纲集合: HTML+CSS:对Web标准的理解.浏览器内核差异.兼容性.hack.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端适应 JavaScript:数据类型.面向对象.继承.闭包.

最全前端面试集合(3)

一.页面从输入 URL 到页面加载显示完成 下载资源:www.yinxiangit.com 简单解答: 1.浏览器根据请求的URL交给DNS域名解析,找到真实IP,向服务器发起请求: 2.服务器交给后台处理完成后返回数据,浏览器接收文件(HTML.JS.CSS.图象等) 3.浏览器对加载到的资源(HTML.JS.CSS等)进行语法解析,建立相应的内部数据结构(如HTML的DOM): 4.载入解析到的资源文件,渲染页面,完成. 详细解答: 1. 浏览器会开启一个线程来处理这个请求,对 URL 分析

最全前端面试集合(2)

1.请问闭包有那一些的特性 答:闭包有三个特性: 1.函数嵌套函数 2.函数内部可以引用外部的参数和变量 3.参数和变量不会被垃圾回收机制回收 注:闭包(closure)是JS语言的一个难点,也是它的独有的特色,在很多的高级应用都要依靠闭包实现. 下载链接:https://www.yinxiangit.com 2.闭包的定义及其优缺点 定义: 闭包 当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数内部的变量,且返回的这个函数在外部被执行,就产生了闭包.闭包是一个环境,具体指的

前端工具集合

前端组织 虽混过外企俩家,但劳资英文这项的技能点还是灰色的...so,俺关注的站点主要以中文为主 名称 推荐指数 备注/说明 Git ★★★★★ 劳资清楚这不是个纯粹的前端社区... 但作为全球最大的搞基社区,无数前端项目在这启航 没Git都不好意思面基有木有! MDN ★★★★★ 不解释,无数的资源再等着你探索 Awesomes.cn ★★★★☆ 国人维护的前端资源库,深度对接到 Github 慕课 ★★★★☆ 大量的在线计算机课程. 虽然初.中级居多,但是不乏有巨作值得细细品尝 W3Cplu

前端网站集合

原网址https://segmentfault.com/a/1190000007062464 内容精简 资源这么多,多看看多学习再总结肯定是好的.多读读就算看重了不算浪费时间,毕竟一千个读者就有一千个林黛玉,还有温故而知新,说不定多读一些内容,就发现惊喜了呢.不过,在此也精简一些内容,就1~2项,只供参考.更多内容细看分类. 知乎:程序员应该如何注意身体健康? js:JavaScript 标准参考教程 js:JavaScript 秘密花园 Es6:ECMAScript 6入门 Es6:深入浅出E

前端面试中的常见的算法问题

虽说我们很多时候前端很少有机会接触到算法.大多都交互性的操作,然而从各大公司面试来看,算法依旧是考察的一方面.实际上学习数据结构与算法对于工程师去理解和分析问题都是有帮助的.如果将来当我们面对较为复杂的问题,这些基础知识的积累可以帮助我们更好的优化解决思路.下面罗列在前端面试中经常撞见的几个问题吧. Q1 判断一个单词是否是回文? 回文是指把相同的词汇或句子,在下文中调换位置或颠倒过来,产生首尾回环的情趣,叫做回文,也叫回环.比如 mamam redivider . 很多人拿到这样的题目非常容易

前端面试所遇到的技术点

前端面试所遇到的技术点: 面试问题: HTML: 常见的HTML标签: (1)行标签和块级标签分别有哪些? (2)常见的HTML5的标签有哪些? (3)如何减少HTTP的请求和优化? 减少请求的资源方法: 将多个css资源文件打包到一个文件里.将多个js打包到一个js文件里.针对图片资源:可采用雪碧图将多个图片放置到一个图片里. 尽量的压缩css文件,js文件,图片文件,采用无损压缩的方式或者是使用webP格式的图片. (4)html5和HTML4的区别 html5可以自定义标签,并兼容html

前端面试绝对会考的JS问题!【已经开源】

写在前面 [前端指南]前端面试库已经开源,正在完善之中 [x] css问题 [x] html问题 [x] javascript问题 github地址 https://github.com/nanhupatar... JavaScript 的组成 JavaScript 由以下三部分组成: ECMAScript(核心):JavaScript 语言基础 DOM(文档对象模型):规定了访问 HTML 和 XML 的接口 BOM(浏览器对象模型):提供了浏览器窗口之间进行交互的对象和方法 JS 的基本数据

2018年前端面试总结

2018年前端面试总结 再有两个月,2018就快过完了,因而有必要在年末对2018年的前端学习做一个总结,本文主要从前端面试中的一些基础知识来对前端进行相关的总结.本文根据网络面试题进行总结. 基础知识 本部分主要从以下几个方面来回顾前端相关的基础知识: HTML相关 CSS相关 JAVASCRIPT相关 DOM相关 HTTP相关 webpack相关 Html html 根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解