面试题库

DOCTYPE有什么作用？区分严格模式与混杂模式有何意义

Mon, 29 May 2023 08:11:05 +0800

<!DOCTYPE＞声明位于文档中的最前面，位于＜html〉标签之前，即告知浏览器的解析器，用什么文档类型规范来解析这个文档。DOCTYPE不存在或格式不正确都会导致文档以混杂模式呈现。

区分严格模式与混杂模式的意义如下。

严格模式的排版和JavaScript 运行模式以该浏览器支持的最高标准运行。在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作（主要针对IE浏览器）。

什么是静态网页？什么是动态网页？

Mon, 29 May 2023 08:07:21 +0800

静态网页是指没有数据交互的网页，即没有数椐库参与，没有服务器端数据的加载。比如静态网页就是只有HTML+CSS+JavaScript做成的网站。

动态网页是指有后台数据参与的网页，网页中的数椐是从数据库中提取的，需要有后台逻辑的支持。比如动态网页就是JSP页面（后台语言是Java）、ASP页面（后台语言是ASP.NET）等。

认为有动画的网页就是动态网页，这是一个严重的误区

严格模式和混杂模式如何区分？如何触发这两种模式？

Mon, 29 May 2023 08:05:48 +0800

严格模式就是浏览器根据 We 标准去解析页面的方法种要求严格的 DTD不九许使用任何表现层的语法；混杂模式是种向后兼容的解析方法

触友严格模式或者标准模式很简单，就是在 HTML 标签前声明正确的 DTD；

触发混杂模式可以在 HTML 文档开始时不声明 DTD ，或者在 DOCTYPE 前加入 XML 声明

HTML XHTML 有什么区别？

Mon, 29 May 2023 08:05:14 +0800

HTML在是一种基于 Web 网页的设计语言， XHTML 是一种基于 XML 、语法严格、标准的设计语言

两者主要的不同是 XHTML 元素必须正确地嵌套，元素必须关闭，标签必须小写必须有根元素； HTML 没有这些限制

谈谈你对 Web 标准以及 W3C 的理解和认识

Mon, 29 May 2023 04:44:42 +0800

标签要闭合，英文小写，且不要嵌套混乱，用标签语义化未提高技索的概率.

使用外链式的 css JS ( Java Script 的缩写）脚本，使结构、样式、行为分离，内容能被更广泛的设备所访问，代码精简开发组件化，代码易维护、可复用，改版、升级方便

请写出如下代码的打印结果

Sat, 13 May 2023 09:58:31 +0800

function Foo() {
  Foo.a = function () {
    console.log(1);
  };
  this.a = function () {
    console.log(2);
  };
}
Foo.prototype.a = function () {
  console.log(3);
};
Foo.a = function () {
  console.log(4);
};
Foo.a();
let obj = new Foo();
obj.a();

	Foo.a();



	





	





	答：4 2 1

编程算法题

Sat, 13 May 2023 09:57:21 +0800

用 JavaScript 写一个函数，输入 int 型，返回整数逆序后的字符串。如：输入整型 1234，返回字符串“4321”。要求必须使用递归函数调用，不能用全局变量，输入函数必须只有一个参数传入，必须返回字符串。

function fun(num) {
  let num1 = num / 10;
  let num2 = num % 10;
  if (num1 < 1) {
    return num;
  } else {
    num1 = Math.floor(num1);
    return `${num2}${fun(num1)}`;
  }
}
var a = fun(12345);
console.log(a);
console.log(typeof a);

写出如下代码的打印结果

Sat, 13 May 2023 09:55:45 +0800

function changeObjProperty(o) {
  o.siteUrl = "http://www.baidu.com";
  o = new Object();
  o.siteUrl = "http://www.google.com";
}
let webSite = new Object();
changeObjProperty(webSite);
console.log(webSite.siteUrl);


	答：



	webSite 属于复合数据类型，函数参数中以地址传递，修改值会影响到原始值，



	但如果将其完全替换成另一个值，则原来的值不会受到影响

React 和 Vue 的 diff 时间复杂度从 O(n^3) 优化到 O(n) ，那么 O(n^3) 和 O(n) 是如何计算出来的？

Fri, 12 May 2023 09:49:44 +0800

三种优化来降低复杂度：

1.如果父节点不同，放弃对子节点的比较，直接删除旧节点然后添加新的节点重新渲染；

2.如果子节点有变化，Virtual DOM 不会计算变化的是什么，而是重新渲染，

3.通过唯一的 key 策略

介绍下前端加密的常见场景和方法

Fri, 12 May 2023 08:20:23 +0800

首先，加密的目的，简而言之就是将明文转换为密文、甚至转换为其他的东西，用来隐藏明文内容本身，防止其他人直接获取到敏感明文信息、或者提高其他人获取到明文信息的难度。通常我们提到加密会想到密码加密、HTTPS 等关键词，这里从场景和方法分别提一些我的个人见解。

场景-密码传输

前端密码传输过程中如果不加密，在日志中就可以拿到用户的明文密码，对用户安全不太负责。这种加密其实相对比较简单，可以使用 PlanA-前端加密、后端解密后计算密码字符串的 MD5/MD6 存入数据库；也可以 PlanB-直接前端使用一种稳定算法加密成唯一值、后端直接将加密结果进行 MD5/MD6，全程密码明文不出现在程序中。

PlanA 使用 Base64 / Unicode+1 等方式加密成非明文，后端解开之后再存它的MD5/MD6 。

PlanB 直接使用 MD5/MD6 之类的方式取 Hash ，让后端存 Hash 的 Hash 。

场景-数据包加密

应该大家有遇到过：打开一个正经网站，网站底下蹦出个不正经广告——比如X 通的流量浮层，X 信的插入式广告……（我没有针对谁）但是这几年，我们会发现这种广告逐渐变少了，其原因就是大家都开始采用 HTTPS 了。被人插入这种广告的方法其实很好理解：你的网页数据包被抓取->在数据包到达你手机之前被篡改->你得到了带网页广告的数据包->渲染到你手机屏幕。而 HTTPS 进行了包加密，就解决了这个问题。严格来说我认为从手段上来看，它不算是一种前端加密场景；但是从解决问题的角度来看，这确实是前端需要知道的事情。

Plan 全面采用 HTTPS

场景-展示成果加密

经常有人开发网页爬虫爬取大家辛辛苦苦一点一点发布的数据成果，有些会影响你的竞争力，有些会降低你的知名度，甚至有些出于恶意爬取你的公开数据后进行全量公开……比如有些食谱网站被爬掉所有食谱，站点被克隆；有些求职网站被爬掉所有职位，被拿去卖信息；甚至有些小说漫画网站赖以生存的内容也很容易被爬取。

Plan 将文本内容进行展示层加密，利用字体的引用特点，把拿给爬虫的数据变成“乱码”。举个栗子：正常来讲，当我们拥有一串数字“12345”并将其放在网站页面上的时候，其实网站页面上显示的并不是简单的数字，而是数字对应的字体的“12345”。这时我们打乱一下字体中图形和字码的对应关系，比如我们搞成这样：

图形：1 2 3 4 5 字码：2 3 1 5 4

这时，如果你想让用户看到“12345”，你在页面中渲染的数字就应该是“23154”。

这种手段也可以算作一种加密