javascript - QUIZ - 个人文章 - SegmentFault 思否

1. 实现css布局
一个div垂直居中
其距离屏幕左右两边各10px
其高度始终是宽度的50%

div中有文本'A'
其font—size:20px
文本水平垂直居中

  <style>
    .wrapper {
      margin: 0 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: pink;
    }
  </style>

<body>
  <div class="wrapper">
    <div class="font">A</div>
  </div>
</body>

ps: 经试验其高度始终是宽度的50% 这个没有实现

2.函数中的arguments是数组吗？类数组转数组的方法了解一下？

arguments类数组
var array = [...arguments]

3.类型比较

if([]==false){console.log(1)};
if({}==false){console.log(2)};
if([]){console.log(3)}
if([1]==[1]){console.log(4)}

都不打印

4.EventLoop

async function a1 () {
    console.log('a1 start')
    await a2()
    console.log('a1 end')
}
async function a2 () {
    console.log('a2')
}

console.log('script start')

setTimeout(() => {
    console.log('setTimeout')
}, 0)

Promise.resolve().then(() => {
    console.log('promise1')
})

a1()

let promise2 = new Promise((resolve) => {
    resolve('promise2.then')
    console.log('promise2')
})

promise2.then((res) => {
    console.log(res)
    Promise.resolve().then(() => {
        console.log('promise3')
    })
})
console.log('script end')

打印：
script start
a1 start
a2
a1 end
script end
promise1
promise2
promise2.then
promise3
setTimeout

promise2错了，知道为什么，但是不知道为啥a1 end是在异步代码执行后打印的

5.改正代码，输出0123401234

function a () {
    for (var i = 0; i < 5; i++) {
        this.i = i
        setTimeout(function () {
            console.log(i)
        }, 0)
        console.log(this.i)
    }
}

a()

将var改成let 考察闭包
但是好像是错的....为什么改成let会中间出现undefined.....
改成let后：
01234undefined01234

6.手写bind实现

Function.prototype.bind2 = function (context) {

    var self = this;
    // 获得bind的参数从第二个参数到最后一个参数
    var args = Array.prototype.slice.call(arguments, 1);

    var fNOP = function () {};

    var fBound = function () {
        // 指bind返回的函数传入的参数
        var bindArgs = Array.prototype.slice.call(arguments);
        // new bind返回的函数,this失效，但传入的参数生效
        return self.apply(this instanceof fNOP ? this : context, args.concat(bindArgs));
    }
    // 保证继承，原型链，下面两行代码等同于Object.creater()  fbound.prototype = Object.create(this.prototype);
    fNOP.prototype = this.prototype;
    fBound.prototype = new fNOP();
    return fBound;
}

7.看这个图，我的理解是，持续触发事件，每隔一段时间，只执行一次事件，事件节流

function throttle(func, wait) {
    var context, args;
    var previous = 0;

    return function() {
        var now = +new Date();
        context = this;
        args = arguments;
        if (now - previous > wait) {
            func.apply(context, args);
            previous = now;
        }
    }
}

//调用
元素.onmousemove = throttle(func, 100);

8.从一个无序，不相等的数组中，选取N个数，使其和为M实现算法
算法题凉.....我感觉这道题应该和二叉树有关......

9.一个字典['I', 'have', 'a', 'book', 'good']，实现一个函数，判断一个字符串中是否都是出自字典中的，输出true/false
算法题凉.....
笨方法：

var arr = ['I', 'have', 'a', 'book', 'good']
var str = 'I have a book'

function test(str,arr) {
    return arr.filter(v => str.indexOf(v) !== -1).length === str.split(' ').length
}

10.一个长阶梯有n级，可以一次走1级，一次走2级，一共有多少种走法？

function test (n) {
    if (n === 1) return 1
    if (n === 2) return 2
    return test(n - 1) + test(n - 2)
}

用笨方法做的....先写出来n为1，2，3，4，5时的走法，看出是用递归

QUIZ

Rainie

引用和评论

javascript垃圾回收机制 - 标记清除法/引用计数/V8机制

前端如何入门 Go 语言

100个React最佳实践小技巧

前端开发工具

开发插件集合

JS校验身份证号

Bitmap 和布隆过滤器傻傻分不清？你这不应该啊