other

css

  1. CSS BFC

js

  1. promise

  2. 跨域

  3. Macrotask Queue和Microtask Queue

  4. 数组排序

  5. 数组去重

  6. ES6

  7. WebAssembly 是一种可以使用非 JavaScript 编程语言编写代码并且能在浏览器上运行的技术方案。、

  8. ES5,ES6中this指向

  9. 理解 JavaScript 中的 This, Bind, Call 和 Apply
    详情

  10. 如何判断object是数组类型?
    1、从原型入手,Array.prototype.isPrototypeOf(obj);
    2.Array.isArray()方法。例:Array.isArray([1, 2, 3]); // true

  11. 精确获取页面元素位置的方式有哪些

    1
    2
    3
    4
    5
    var X= this.getBoundingClientRect().left;
    var Y =this.getBoundingClientRect().top;
    //再加上滚动距离,就可以得到绝对位置
    var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
    var Y =this.getBoundingClientRect().top+document.documentElement.scrollTop;
  12. 事件委托
    又叫事件代理,利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件;
    作用:
    在JavaScript中,添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能,因为需要不断的与dom节点进行交互,访问dom的次数越多,引起浏览器重绘与重排的次数也就越多,就会延长整个页面的交互就绪时间,这就是为什么性能优化的主要思想之一就是减少DOM操作的原因;如果要用事件委托,就会将所有的操作放到js程序里面,与dom的操作就只需要交互一次,这样就能大大的减少与dom的交互次数,提高性能;

每个函数都是一个对象,是对象就会占用内存,对象越多,内存占用率就越大,自然性能就越差了(内存不够用,是硬伤,哈哈),比如上面的100个li,就要占用100个内存空间,如果是1000个,10000个呢,那只能说呵呵了,如果用事件委托,那么我们就可以只对它的父级(如果只有一个父级)这一个对象进行操作,这样我们就需要一个内存空间就够了,是不是省了很多,自然性能就会更好。

  1. 构造函数
    实例的__proto__属性(原型)等于其构造函数的prototype属性
    例:

    1
    2
    3
    4
    5
    6
    function Person(name) {
    this.name = name
    }
    let p = new Person('Tom');
    1. p.__proto__等于什么?Person.prototype
    2. Person.__proto等于什么? Function.prototype
  2. 匿名函数 又称IIFE(为了隔离作用域,防止污染全局命名空间。) 函数名没有意义

    1
    2
    3
    4
    5
    6
    7
    (
    function(){
    console.log(1)
    }+
    )()
    ==
    var a = function(){console.log(1)};a()
  3. 宏任务和微任务

其他

  1. webpack插件 prerender-spa-plugin 预渲染

  2. 在浏览器输入URL回车之后发生了什么

函数柯里化

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
// 设置一个函数输出一下的值
console.log(add(1)(2)(3)); // 6

function add(){
// 1 把所有参数转换成数组
let args = Array.prototype.slice.call(arguments)
// 2 再次调用add函数,传递合并当前与之前的参数
let fn = function() {
let arg_fn = Array.prototype.slice.call(arguments)
return add.apply(null, args.concat(arg_fn))
}
// 3 最后默认调用,返回合并的值
fn.toString = function() {
return args.reduce(function(a, b) {
return a + b
})
}
return fn
}

// ES6写法
function add () {
let args = [...arguments];
let fn = function(){
return add.apply(null, args.concat([...arguments]))
}
fn.toString = () => args.reduce((a, b) => a + b)
return fn;
}

原型,原型链,原型继承,继承方式

https://juejin.im/post/6875152247714480136