Blog

先简单说一下原理吧，在网页上和服务器上建立一个ws连接，然后网页获取用户输入传给服务端，服务端解析用户输入，在服务端shell执行命令并将执行输出通过ws传给网页渲染到页面上。

以上原理说起来简单，但是完全自己实现是不太现实的。下面我把实现用到的库和插件以及使用方式简单说一下。

一直以来，我都听到过各式各样的测试——单元测试、黑盒测试、压力测试等等，但是很难对所有的测试方式有一个总体的认知。

在经过大量的谷歌之后，我终于把各种种类的测试弄清白了，下面针对每一种测试做一个简单的一句话介绍，更详细的介绍可以自行搜索。

面试遇到了问题:<p>中能不能插入<div>? 插入<div>会如何?

先直接实践下：

我们可以看到,

把

分成了两段, 并且div外字段并不在

内。把div变成行内块级元素也不行。

解答: 可以在HTML标准(https://www.w3.org/TR/html401/struct/text.html#h-9.3.1)中看到,

虽然是块级元素, 但是只能包含行内元素, 不能包含块级元素(包括

自己)

over!

作为一个开发人员，或多或少都听说过对称加密、非对称加密、摘要、数字签名、数字证书这几个概念，它们是用来保证在互联网通信过程中数据传输安全的。有人可能会有疑惑，我给传输数 据加个密不就安全了，为什么还要搞这么多花样出来？本文主要通过一个案例来讲解这几个概念的实际作用。

在此之前，我先简单介绍一下这几个概念。

对称加密

对称加密是指用来加密和解密的是同一个秘钥。其特点是加密速度快，但是秘钥容易被黑客截获，所以安全性不高。密钥不可能一开始在发送方和接收方都全部生成好了 需要在一方生成之后传递给另一方 如果在传递过程密钥被劫持 整个加密就不安全了。常见的有AES、DES算法。

非对称加密

非对称加密是指用来加密和解密的是不同的秘钥，它们是成对出现的，称为公钥和私钥，知道其中一个秘钥是无法推导出另外一个秘钥的。用公钥加密的内容需要用私钥才能解密，用私钥加密 的内容需要用公钥才能解密。非对称加密的特点是安全性高，缺点是加密速度慢。公钥对外公开 如果密文是私钥加密 那么任何人都能用公钥解密。常见的有RSA、ECC算法。

混合加密

在传递过程把我们的对称加密中的密钥用非对称加密的方式去传递就好了。

摘要

所谓的摘要就是一段信息或者一个文件通过某个哈希算法(也叫摘要算法)而得到的一串字符。摘要算法的特点就是不同的文件计算出的摘要是不同的(也有可能相同，但是可能性非常非常低)， 比如一个1G的视频文件，哪怕只是改动其中一个字节，最后计算得到的摘要也是完全不同的，所以摘要算法通常是用来判断文件是否被篡改过。其还有一个特点就是通过摘要是无法推导出源文 件的信息的。常用的摘要(散列)算法有MD5、SHA等。

数字签名

数字签名就是一个文件的摘要加密后的信息。数字签名是和源文件一起发送给接收方的，接收方收到后对文件用摘要算法算出一个摘要，然后和数字签名中的摘要进行比对，两者不一致的话说 明文件被篡改了。

数字证书

数字证书是一个经证书授权中心生成的文件，数字证书里一般会包含公钥、公钥拥有者名称、CA的数字签名、有效期、授权中心名称、证书序列号等信息。其中CA的数字签名是验证证书是否被 篡改的关键，它其实就是对证书里面除了CA的数字签名以外的内容进行摘要算法得到一个摘要，然后CA机构用他自己的私钥对这个摘要进行加密就生成了CA的数字签名，CA机构会公开它的公 钥，验证证书时就是用这个公钥解密CA的数字签名，然后用来验证证书是否被篡改。

请做一下自我介绍

回答提示： 一般人回答这个问题过于平常，只说姓名、年龄、工作经验，这些在简历上都有。其实，企业最希望知道的是求职者能否胜任工作，包括：最强的技能、最深入研究的知识领域、个性中最积极的部分、做过的最成功的事，主要的成就等，要突出积极的个性和做事的能力，说的合情合理企业才会相信。

你最大的优点是什么？

回答提示： 沉着冷静、条理清楚、立场坚定、乐于助人等，加上例子如：我在XX经过一到两年的培训及项目实战，加上实习工作，我想我适合这份工作。

说说你最大的缺点？

回答提示： 这个问题企业问的概率很大，通常不希望听到直接回答的缺点是什么等，如果求职者说自己小心眼、非常懒、工作效率低，企业肯定不会录用你。要从自己的优点说起，中间加一些小缺点，最后再把问答转回到优点上，突出优点的部分。

面试流程

大公司面试无论是实习还是校招，普遍存在面试轮次多，面试周期长的特点，就拿腾讯来说，如果你想成为暑期实习生，大概需要四到五轮面试，3-4 轮技术面+一轮 HR 面试，每次面试时间大概在 0.5-1 小时之间，推荐对自己能力没有把握或者缺少工作经验的同学尽可能在大三下学期找找实习，去自己想去的公司实习，因为大三的暑期实习既可以丰富你的履历，并且实习期间好好表现都是可以相对容易地通过转正，拿到校招 offer。

在申请实习或者校招 offer 的时候，尽可能多找人帮忙内推，因为大公司部门比较多，你如果直接从官网上网申的话，简历不容易被人查看，找认识的师兄师姐帮忙内推的优势在于：

1. 能够更有效增加你的简历的曝光，让部门主管能够直接查阅到你的简历
2. 加快面试进度，联系师兄师姐提前知道面试结果
3. 内推或者网申(可能有笔试)完之后，就等待面试官打电话给你，一般他们会跟你通过电话或者短信确认现在是否方便或者约个时间进行面试，面试的方式也分为电话面试，视频面试，现场面试等等。

一. package.json 解读

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

{
	"name": "hello world", // 项目名称
	"version": "0.0.1", // 版本号：大版本.次要版本.小版本
	"author": "张三",
	"description": "第一个node.js程序",
	"keywords":["node.js","javascript"], // 关键词，有助于 npm search 发现
	"repository": { // 存储库，指定代码所在位置（如果git repo在GitHub上，那么该npm docs 命令将能够找到文件位置。）
		"type": "git",
		"url": "https://path/to/url"
	},
	"license":"MIT", // 指定包许可证，详细可见[SPDX许可证ID的完整列表](https://spdx.org/licenses/)
	"engines": {"node": "0.10.x"}, // 指定该模块运行的平台，可以指定 node 版本、npm 版本等
	"bugs":{"url":"http://path/to/bug","email":"bug@example.com"}, // 项目问题跟踪器的URL和应报告问题的电子邮件地址。
	"contributors":[{"name":"李四","email":"lisi@example.com"}],
    "bin": { // 指定内部命令对应的可执行文件的位置，在 scripts 中就可以简写
    	"webpack": "./bin/webpack.js"
  	},
    "main": "lib/webpack.js", // 指定加载的模块入口文件，require('moduleName')就会加载这个文件。这个字段的默认值是模块根目录下面的index.js。
    "config" : { "port" : "8080" }, // 用于添加命令行的环境变量（用户在运行 scripts 命令时，就默认在脚本文件中添加 process.env.npm_package_config_port，用户可以通过 npm config set foo:port 80 命令更改这个值）
	"scripts": { // 指定运行脚本的 npm 命令行缩写
		"start": "node index.js"
	},
    "peerDependencies": { // 指定项目安装必须一起安装的模块及其版本号，（注意：从 npm 3.0 开始，peerDependencies不会再默认安装）
    	"chai": "1.x"
  	},
	"dependencies": { // 指定项目运行所依赖的模块
		"express": "latest",
		"mongoose": "~3.8.3",
		"handlebars-runtime": "~1.0.12",
		"express3-handlebars": "~0.5.0",
		"MD5": "~1.2.0"
	},
	"devDependencies": { // 指定项目开发所需要的模块
		"bower": "~1.2.8",
		"grunt": "~0.4.1",
		"grunt-contrib-concat": "~0.3.0",
		"grunt-contrib-jshint": "~0.7.2",
		"grunt-contrib-uglify": "~0.2.7",
		"grunt-contrib-clean": "~0.5.0",
		"browserify": "2.36.1",
		"grunt-browserify": "~1.3.0",
	},
    "browser": { // 指定该模板供浏览器使用的版本
  		"tipso": "./node_modules/tipso/src/tipso.js"
	},
    "preferGlobal": true, // 表示当用户不将该模块安装为全局模块时（即不用–global参数），要不要显示警告，表示该模块的本意就是安装为全局模块。
}

package.json 在 node 和 npm 环节都要使用，node 在调用 require 的时候去查找模块，会按照一个次序去查找，package.json 会是查找中的一个环节。npm 用的就比较多，其中的 dependencies 字段就是本模块的依赖的模块清单。每次npm update的时候，npm会自动的把依赖到的模块也下载下来。当npm install 本模块的时候，会把这里提到的模块都一起下载下来。通过package.json,就可以管理好模块的依赖关系。

关于更多规范，请看官方npm-package.json

1. png24位的图片在iE6浏览器上出现背景，解决方案是做成PNG8.

2. 浏览器默认的margin和padding不同。解决方案是加一个全局的*{margin:0;padding:0;}来统一

3. IE6双边距bug:块属性标签float后，又有横行的margin情况下，在ie6显示margin比设置的大。

浮动ie产生的双倍距离 #box{ float:left; width:10px; margin:0 0 0 10px;}

这种情况之下IE会产生20px的距离，解决方案是在float的标签样式控制中加入 display:inline;将其转化为行内属性。(这个符号只有ie6会识别)

1
2
3
4
5
6

.bb{
    background-color:red;/*所有识别*/
    background-color:#00deff\9; /*IE6、7、8识别*/
    +background-color:#a200ff;/*IE6、7识别*/
    _background-color:#1e0bd1;/*IE6识别*/
}

在处理表单登录的过程中，遇到了一个问题，当我们在输入框输入内容输入框获取到焦点时，输入框后面会出现一个图标删除已输入的内容，因此删除图标会绑定一个click事件，但是当我们点击图标的时候，也触发了input的blur事件，blur事件会让input失去焦点时隐藏删除的图标，并且blur事件先于图标的click事件执行，因此这时候点击图标并不会删除输入框已输入的内容，而是图标消失了。还有弹窗输入框blur同时点击取消按钮关闭，也会出现需要点击2次的情况。

JavaScript 一开始并没有内建模块化支持，也几乎没有模块化这种概念。当时没那么大的需求，搞个模块化显得大材小用啊。随着互联网的发展，尤其是 2006 年 ajax 技术的出现和之后 Web 2.0 的兴起，越来越多的业务逻辑向前端转移，前端开发的复杂程度和代码量逐渐提升。这时，由于缺乏模块化概念，JavaScript 的一些问题便凸显出来：代码难以复用、容易出现全局变量污染和命名冲突、依赖管理难以维护等等。一开始，开发者们使用诸如暴露全局对象、自执行函数等方法来规避这些问题，但仍无法从根本上解决问题。