20190928多益网络前端笔试总结

首先是题型：
选择题6
填空题6
问答题7
编程题2

选择题主要是一些前端的基础，就不过赘述了，

填空题：
1. CSS动画属性
语法：animation: name duration timing-function delay iteration-count direction fill-mode play-state;
2. box-shadow的设置
语法：

/* x偏移量 | y偏移量 | 阴影颜色 */
box-shadow: 60px -16px teal;
 
/* x偏移量 | y偏移量 | 阴影模糊半径 | 阴影颜色 */
box-shadow: 10px 5px 5px black;
 
/* x偏移量 | y偏移量 | 阴影模糊半径 | 阴影扩散半径 | 阴影颜色 */
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
 
/* 插页(阴影向内) | x偏移量 | y偏移量 | 阴影颜色 */
box-shadow: inset 5em 1em gold;
 
/* 任意数量的阴影，以逗号分隔 */
box-shadow: 3px 3px red, -1em 0 0.4em olive;
 
/* 全局关键字 */
box-shadow: inherit;
box-shadow: initial;
box-shadow: unset;

1. http的静态文件的头字段及其值是什么
   1、Cache-Control:max-age=2592000：缓存内容将在2592000秒后失效（30天）。
   2、ETag:”58d48c15-f7b”：页面编号
   3、Expires:Wed, 12 Jul 2017 05:42:41 GMT：缓存内容将在2017年7月12日后过时。
   4、Last-Modified:Fri, 24 Mar 2017 03:01:41 GMT：服务端资源最后修改时间。
2. setTimeout和Promise的输出顺序

  setTimeout(function() {
                console.log(1)
            }, 0);
            new Promise(function(a, b) {
                console.log(2);
                for(var i = 0; i < 10; i++) {
                    i == 9 && a();
                }
                console.log(3);
            }).then(function() {
                console.log(4)
            });
            console.log(5)

输出结果：2,3,5,4,1
5. 页面元素的垂直水平居中
这个简单就不写了
问答题：
1. background-color以及background-image的覆盖范围
背景色覆盖范围: border+ width+ padding ;背景图覆盖范围: width + padding ;
2. XSS的攻击原理是什么，过滤Html标签能否防止？并列举不能的情况
XSS又称CSS，全称Cross SiteScript，跨站脚本攻击，是Web程序中常见的漏洞，XSS属于被动式且用于客户端的攻击方式，所以容易被忽略其危害性。其原理是攻击者向有XSS漏洞的网站中输入(传入)恶意的HTML代码，当其它用户浏览该网站时，这段HTML代码会自动执行，从而达到攻击的目的。如，盗取用户Cookie、破坏页面结构、重定向到其它网站等。
肯定不能完全防止，比如过滤不了特殊字符或者名单不全之类的
3. js中的0.1+0.2为啥不等于0.3，怎么解决
因为计算机不能精确表示0.1， 0.2这样的浮点数，计算时使用的是带有舍入误差的数
并不是所有的浮点数在计算机内部都存在舍入误差，比如0.5就没有舍入误差
具有舍入误差的运算结可能会符合我们的期望，原因可能是“负负得正”
解决方法？
1. 个办法是使用整型代替浮点数计算；
2. 是不要直接比较两个浮点数，而应该使用bignumber.js这样的浮点数运算库
3. 把计算数字 提升 10 的N次方 倍 再 除以 10的N次方。一般都用 1000 就行了。

编程题：
在nodejs环境下
1. 将Html页面中的h1，h2，h3标签转换为可点击锚节点。

1. 手写promise.race与promise.all
   Promise.race(iterable) 方法返回一个 promise，一旦迭代器中的某个promise解决或拒绝，返回的 promise就会解决或拒绝。

var promise1 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 500, 'one');
});
 
var promise2 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 100, 'two');
});
 
Promise.race([promise1, promise2]).then(function(value) {
  console.log(value);
  // Both resolve, but promise2 is faster
});
// expected output: "two"

Promise.all(iterable) 方法返回一个 Promise 实例，此实例在 iterable 参数内所有的 promise 都“完成（resolved）”或参数中不包含 promise 时回调完成（resolve）；如果参数中 promise 有一个失败（rejected），此实例回调失败（reject），失败原因的是第一个失败 promise 的结果。

var promise1 = Promise.resolve(3);
var promise2 = 42;
var promise3 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, 'foo');
});
 
Promise.all([promise1, promise2, promise3]).then(function(values) {
  console.log(values);
});
// expected output: Array [3, 42, "foo"]