随笔- 25 文章- 0 评论- 0 阅读- 10040

记录一下今天的面试

首先是笔试，一共十三道题，时间半小时。

第一题字符串去重，直接使用ES6的Set很简单，

var str = 'dkhawdlakw4dwadkn'
console.log([...new Set([...str])].join(''));

第二题考CSS的多种垂直居中，我就写了两种我常用的，一个是父元素display设为flex，子元素margin为auto

.parent {
  display: flex;
  width: 100px;
  height: 100px;
  background-color: red;
}
.child {
  margin: auto;
  width: 50px;
  height: 50px;
  background-color: aqua;
}　

第二种用position + tansfrom

.parent {
  position: relative;
  width: 100px;
  height: 100px;
  background-color: red;
}
.child {
  position: absolute;
  left: 50%;top: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
  background-color: aqua;
}

行内元素主流就行高等于父级元素高+text-align:center;

第三题

第四题

第五题考闭包

function foo () {
  var i = 0
  return function() {
    console.log(i++);
  }
}
const a = foo()
const b = foo()
a(), b(), a()

第六题

第七题是一道考Date的题，将一个时间戳转换为'2001-01-01 01:01'类型的字符串

当时我写的都笨方法，分别获取年月日分时的数值，补零处理相加

其实Date.prototype上自带了一个方法，可以获取

const date = new Date(1644399044354).toLocaleString('chinese', {hour12: false}).slice(0, 14)

默认获取12小时制的年月日时分秒，使用字符串截取就可以了。

第八题考的是this指向

var a = '1'
function foo () {
  console.log(this.a);
}
const b = {a : '2', foo}
const c = {a: '3', foo}
const d = {a: '4', foo}
b.foo()
c.foo()
b.foo.call(d)

考的无非是谁调用函数，this就指向谁，还有call,apply,bind的了解

其实类似的题有很多

var name = 'window'
var person1 = {
  name: 'person1',
  foo1: function () {
    console.log(this.name);
  },
  foo2: () => console.log(this.name),
  foo3: function () {
    return function () {
      console.log(this.name);
    }
  },
  foo4: function () {
    return () => {
      console.log(this.name);
    }
  }
}

var person2 = {name: 'person2'}
person1.foo1()//person1
person1.foo1.call(person2)//person2

person1.foo2()//window
person1.foo2.call(person2)//window

person1.foo3()()//window
person1.foo3.call(person2)()//window
person1.foo3().call(person2)//person2

person1.foo4()()//person1
person1.foo4.call(person2)()//person2
person1.foo4().call(person2)//person1

var name = 'window'
function Person(name) {
  this.name = name
  this.foo1 = function () {
    console.log(this.name);
  }
  this.foo2 = () => console.log(this.name);
  this.foo3 = function () {
    return function () {
      console.log(this.name);
    }
  }
  this.foo4 = function () {
    return () => {
      console.log(this.name);
    }
  }
}
let person1 = new Person('person1')
let person2 = new Person('person2')

person1.foo1()//person1
person1.foo1.call(person2)//person2

person1.foo2()//person1
person1.foo2.call(person2)//person1

person1.foo3()()//window
person1.foo3.call(person2)()//window
person1.foo3().call(person2)//person2

person1.foo4()()//person1
person1.foo4.call(person2)()//person2
person1.foo4().call(person2)//person1