正文

前端知识点整理03

author  author  2022-08-18  202

关键词：

75.说说你对前端架构师的理解

负责前端团队的管理及与其他团队的协调工作，提升团队成员能力和整体效率；带领团队完成研发工具及平台前端部分的设计、研发和维护；带领团队进行前端领域前沿技术研究及新技术调研，保证团队的技术领先负责前端开发规范制定、功能模块化设计、公共组件搭建等工作，并组织培训。

实现一个函数clone，可以对JavaScript中的5种主要的数据类型（包括Number、String、Object、Array、Boolean）进行值复制

 Object.prototype.clone = function(){

            var o = this.constructor === Array ? [] : {};

            for(var e in this){

                    o[e] = typeof this[e] === "object" ? this[e].clone() : this[e];

            }

            return o;
    }

76.说说严格模式的限制

严格模式主要有以下限制：

变量必须声明后再使用

函数的参数不能有同名属性，否则报错

不能使用with语句

不能对只读属性赋值，否则报错

不能使用前缀0表示八进制数，否则报错

不能删除不可删除的属性，否则报错

不能删除变量delete prop，会报错，只能删除属性delete global[prop]
eval不会在它的外层作用域引入变量

eval和arguments不能被重新赋值

arguments不会自动反映函数参数的变化

不能使用arguments.callee

不能使用arguments.caller

禁止this指向全局对象

不能使用fn.caller和fn.arguments获取函数调用的堆栈

增加了保留字（比如protected、static和interface）

设立"严格模式"的目的，主要有以下几个：

消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;

消除代码运行的一些不安全之处，保证代码运行的安全；

提高编译器效率，增加运行速度；

为未来新版本的Javascript做好铺垫。

注：经过测试IE6,7,8,9均不支持严格模式。

77.如何删除一个cookie

1.将时间设为当前时间往前一点。

var date = new Date();

date.setDate(date.getDate() - 1);//真正的删除

setDate()方法用于设置一个月的某一天。

2.expires的设置

document.cookie = ‘user=‘+ encodeURIComponent(‘name‘) + ‘;expires = ‘ + new Date(0)

，和，标签

 标签和 标签一样，用于强调文本，但它强调的程度更强一些。

em 是斜体强调标签，更强烈强调，表示内容的强调点。相当于html元素中的 ...;

 是视觉要素，分别表示无意义的加粗，无意义的斜体。

em 和 strong 是表达要素(phrase elements)。

78.说说你对AMD和Commonjs的理解

CommonJS是服务器端模块的规范，Node.js采用了这个规范。CommonJS规范加载模块是同步的，也就是说，只有加载完成，才能执行后面的操作。AMD规范则是非同步加载模块，允许指定回调函数。

AMD推荐的风格通过返回一个对象做为模块对象，CommonJS的风格通过对module.exports或exports的属性赋值来达到暴露模块对象的目的。

详情：也谈webpack及其开发模式

79.document.write()的用法

document.write()方法可以用在两个方面：页面载入过程中用实时脚本创建页面内容，以及用延时脚本创建本窗口或新窗口的内容。

document.write只能重绘整个页面。innerHTML可以重绘页面的一部分

80.编写一个方法求一个字符串的字节长度

假设：一个英文字符占用一个字节，一个中文字符占用两个字节

 function GetBytes(str){

        var len = str.length;

        var bytes = len;

        for(var i=0; i<len; i++){

            if (str.charCodeAt(i) > 255) bytes++;

        }

        return bytes;

    }

alert(GetBytes("你好,as"));

81.git fetch和git pull的区别

git pull：相当于是从远程获取最新版本并merge到本地

git fetch：相当于是从远程获取最新版本到本地，不会自动merge

82.说说你对MVC和MVVM的理解

MVC
View 传送指令到 Controller

Controller 完成业务逻辑后，要求 Model 改变状态

Model 将新的数据发送到 View，用户得到反馈

所有通信都是单向的。

Angular它采用双向绑定（data-binding）：View的变动，自动反映在 ViewModel，反之亦然。

组成部分Model、View、ViewModel

View：UI界面

ViewModel：它是View的抽象，负责View与Model之间信息转换，将View的Command传送到Model；

Model：数据访问层

83.请解释什么是事件代理

事件代理（Event Delegation），又称之为事件委托。是 JavaScript 中常用绑定事件的常用技巧。顾名思义，“事件代理”即是把原本需要绑定的事件委托给父元素，让父元素担当事件监听的职务。事件代理的原理是DOM元素的事件冒泡。使用事件代理的好处是可以提高性能。

84.attribute和property的区别是什么？

attribute是dom元素在文档中作为html标签拥有的属性；

property就是dom元素在js中作为对象拥有的属性。

所以：

对于html的标准属性来说，attribute和property是同步的，是会自动更新的，

但是对于自定义的属性来说，他们是不同步的，

84.说说网络分层里七层模型是哪七层

应用层：应用层、表示层、会话层（从上往下）（HTTP、FTP、SMTP、DNS）

传输层（TCP和UDP）

网络层（IP）

物理和数据链路层（以太网）

每一层的作用如下：

物理层：通过媒介传输比特,确定机械及电气规范（比特Bit）

数据链路层：将比特组装成帧和点到点的传递（帧Frame）

网络层：负责数据包从源到宿的传递和网际互连（包PackeT）

传输层：提供端到端的可靠报文传递和错误恢复（段Segment）

会话层：建立、管理和终止会话（会话协议数据单元SPDU）

表示层：对数据进行翻译、加密和压缩（表示协议数据单元PPDU）

应用层：允许访问OSI环境的手段（应用协议数据单元APDU）

各种协议

ICMP协议：因特网控制报文协议。它是TCP/IP协议族的一个子协议，用于在IP主机、路由器之间传递控制消息。

TFTP协议：是TCP/IP协议族中的一个用来在客户机与服务器之间进行简单文件传输的协议，提供不复杂、开销不大的文件传输服务。

HTTP协议：超文本传输协议，是一个属于应用层的面向对象的协议，由于其简捷、快速的方式，适用于分布式超媒体信息系统。

DHCP协议：动态主机配置协议，是一种让系统得以连接到网络上，并获取所需要的配置参数手段。

85.说说mongoDB和MySQL的区别

MySQL是传统的关系型数据库，MongoDB则是非关系型数据库

mongodb以BSON结构（二进制）进行存储，对海量数据存储有着很明显的优势。

对比传统关系型数据库,NoSQL有着非常显著的性能和扩展性优势，与关系型数据库相比，MongoDB的优点有： ①弱一致性（最终一致），更能保证用户的访问速度： ②文档结构的存储方式，能够更便捷的获取数据。

86.讲讲304缓存的原理

服务器首先产生ETag，服务器可在稍后使用它来判断页面是否已经被修改。本质上，客户端通过将该记号传回服务器要求服务器验证其（客户端）缓存。

304是HTTP状态码，服务器用来标识这个文件没修改，不返回内容，浏览器在接收到个状态码后，会使用浏览器已缓存的文件

客户端请求一个页面（A）。服务器返回页面A，并在给A加上一个ETag。客户端展现该页面，并将页面连同ETag一起缓存。客户再次请求页面A，并将上次请求时服务器返回的ETag一起传递给服务器。服务器检查该ETag，并判断出该页面自上次客户端请求之后还未被修改，直接返回响应304（未修改——Not Modified）和一个空的响应体。

87.什么样的前端代码是好的

高复用低耦合，这样文件小，好维护，而且好扩展。

原文地址：http://www.qdfuns.com/notes/38721/bed740616de4e5795baa5a28cc7be08c.html

前端知识点整理02

53.new操作符具体干了什么呢? 1、创建一个空对象，并且this变量引用该对象，同时还继承了该函数的原型。 2、属性和方法被加入到this引用的对象中。 3、新创建的对象由this所引用，并且最后隐式的返回th... 查看详情

前端之html知识点整理

　htypertextmarkuplanguage 即超文本标记语言　　超文本:就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。　　标记语言:标记（标签）构成的语言.　　　　网页==HTML文档，由浏览器解析，用来展示的　　静态网... 查看详情

前端必会html知识整理

1.浏览器内核： 1.ie：trident（三叉戟）内核 2.firefox：gecko（壁虎）内核 3.safari：webkit（浏览器核心）内核 4.opera：以前是presto（急速）内核，现在改用谷歌的b 查看详情

前端css知识总结整理

1.设置css样式的三种方式？外部样式表，引入一个外部css文件内部样式表，将css代码放在<head>标签内部内联样式，将css样式直接定义在html元素内部2.css有哪些选择器？&nbs... 查看详情

移动端web开发前端知识整理

...14/mobile-web-front-end-collections/ 最近整理的移动端Web开发前端知识，不定期更新。HTML5可以做什么拍照获取地理位置手势canvas绘图和动画(硬件加速)localstorage，本地缓存HTML5动画效果demohttp://fff.cmiscm.com/#!/mainCS 查看详情

前端重要基础知识整理

HTML：1.什么是语义化的HTML?有何意义？为什么要做到语义化？2.行内元素和块元素分别有哪些？3.Doctype是什么？有啥作用？4.iframe的优缺点CSS：1.CSS盒子模型2.CSS优先级3.不使用js,元素垂直居中　　1).简单版　　2).高级版//未完查看详情

知识资源整理

...获得知识的途径，供自己以后参考，相信对别人也有用。前端资讯以后补上其它资源以后补上react学习以后补上前端工具以后补上查看详情

前端知识整理-div+css之页面布局

终于收到了第一份面试邀请。时间是下周一。也是为了验证自己的修炼水平进行一下知识整理顺带查漏补缺也给后来的同学提供一些参考我们用实例来总结：假设进行三栏布局左右300px中间自适应我们有几种解决方案呢？第一种... 查看详情

web前端，html5开发，前端资源，前端网址，前端博客，前端框架整理-转

Web前端/H5开发，前端资源，前端网址，前端博客，前端框架整理-转综合类前端知识体系前端知识结构Web前端开发大系概览Web前端开发大系概览-中文版WebFront-endStackv2.2免费的编程中文书籍索引前端书籍前端免费书籍大全前端... 查看详情

vue知识整理—03-指令2

一：属性：el：‘’ //要控制页面上的那个区域data：//存放el中要用到的数据methods：//（对象）定义vue实例中的可用方法二：指令：1.v-cloak解决插值表达式的闪烁问题2.v-text （和插值表达式类似）... 查看详情

vue知识整理—03-指令(代码片段)

指令：增强元素标签的功能1. v-text & v-html相同点：　　作用：都是替换使用该指令的元素的内容区别：　　v-text是文本输出，显示的格式字符串形式　　v-html是html格式输出注意：尽量避免使用，... 查看详情

前端开发面试题目整理分析

...前端知识架构体系，探究知识的原理，深入了解大厂常考知识点。前端 JS内置类型Typeof类型转换转Boolean对象转基本类型四则运算符==操作符比较运算符原型newinstanceofthis执行上下文闭包深浅拷贝浅拷贝深拷贝模块化CommonJS... 查看详情

vue知识整理—03-指令3(代码片段)

一：v-on的缩写和事件修饰符事件修饰符： .stop阻止冒泡 .prevent阻止默认事件 .capture添加事件侦听器时使用事件捕获模式 .self只当事件在该元素本身（比如不是子元素）触发时触发回调 .on... 查看详情

java知识系统回顾整理01基础05控制流程03while

while和do-while循环语句一、while:条件为true时重复执行只要while中的表达式成立，就会不断地循环执行 ??publicclassHelloWorld ????publicstatic voidmain(String[]args)??????? ????????//打印0到4???? ????????inti=0; 查看详情

前端必会的html知识总结整理(代码片段)

1.浏览器内核ie：trident（三叉戟）内核firefox：gecko（壁虎）内核safari：webkit（浏览器核心）内核opera：以前是presto（急速）内核，现在是和谷歌共同开发的blink࿰ 查看详情

java知识系统回顾整理01基础02面向对象03方法

一、根据实例给出"方法"的定义在LOL中，一个英雄可以做很多事情，比如超神，超鬼，坑队友? 能做什么在类里面就叫做方法 ??比如队友残血正在逃跑，你过去把路给别人挡住了，导致他被杀掉。这就是坑队友每个英雄。。。... 查看详情

java知识系统回顾整理01基础03变量01变量定义

定义：变量：用来命名一个数据的标识符 ??一、什么是变量?用具体实例定义变量变量的定义是：用来命名一个数据的标识符 1949这是一个数字，代表某年如果要命名这个数字，在java里就会写成：intyear=1949;??int?是数据类型，表... 查看详情

0519知识点整理#2-1

0519知识点整理#2-1第一章接口测试及相关工具使用1.什么是接口从数据库中获取数据的前端开发和后端开发用接口（Json）实现交互 Json 一种所有... 查看详情