前端大厂面试题3

选择题
下面哪个不是css中的长度单位？
Answer©
A. px
B. rem
C. th
D. vw
以下代码运行的结果是？
Answer（C）
var x = 21
var girl = function () {
console.log(x)
var x = 20
}
girl()
A. 21
B. 20
C. undefined
D. null
关于箭头函数，下面正确的是哪个？
Answer (D)
A. 箭头函数可以通过 .call()、.apply()、.bind() 方法来重新绑定它的 this 值
B. 箭头函数可以像普通函数一样使用 arguments 对象
C. 箭头函数可以被 new，会像普通函数一样自动拥有 prototype 属性
D. 箭头函数没有自己的 this，但是会继承上层作用域的 this，就像其他普通的变量一样
以下哪些场景下请求会触发跨域？
Answer（ABC）
A. 由 XMLHttpRequest 或 Fetch 发起的跨域 HTTP 请求
B. CSS 中通过 @font-face 使用字体资源
C. 使用 drawImage 将 Images/video 画面绘制到 canvas
D. html script 请求 JS 资源
RGB(23,21,123) 的色值，我们转成 16 位进制的字符串去使用，其值为：
Answer（A）
A. #17157B
B. #23731A
C. #16232C
D. #14321A
问答题
可通过哪些手段，将页面 A 上的某个关键值传递给页面 B
Answer
跳转 url 上带 query 或 hash 的参数
通过 postmessage 传值
同域下可以通过 cookie 或者 localstorage
可以将值传递到服务器端，远程获取
什么是事件循环（EVENT LOOP）？
Answer
我们常常说 js 是单线程的，是指 js 执行引擎是单线程的，除了这个单线程，还有一个 任务队列，在执行 js 代码的过程中，执行引擎遇到注册的延时方法，如定时器，DOM 事件， 会将这些方法交给相应的浏览器模块处理，当这些延时方法有触发条件去触发的时候， 这些延时方法会被添加至任务队列，而这些任务队列中的方法只有js的主线程空闲了才会执行， 这也就是说我们常常用的定时器定的时间参数只是一个触发条件，具体多少时间后执行其实还需要看 js 主线程空闲与否

请给出下列代码的输出
null == undefined // true
0.1 + 0.2 == 0.3 // false
typeof NaN // “number”
typeof Function // “function”
typeof Object // “function”
typeof {} // “object”
‘a’ + 1 // “a1”
‘a’ - 1 // NaN
Function instanceof Object // true
Object instanceof Function // true
Answer
null == undefined // true
0.1 + 0.2 == 0.3 // false
typeof NaN // “number”
typeof Function // “function”
typeof Object // “function”
typeof {} // “object”
‘a’ + 1 // “a1”
‘a’ - 1 // NaN
Function instanceof Object // true
Object instanceof Function // true
Coding
paddingNum
/**

• 使用 javascript 实现 paddingNum 方法
• @description 分隔数字，每隔三位使用逗号分隔一次
• @param {Number}
• @returns {String} 返回分隔后的字符串
• @example
• paddingNum(33) // return ‘33’
• paddingNum(1234.56) // return ‘1,234.56’
• paddingNum(123456789) // return ‘123,456,789’
• paddingNum(987654.321) // return ‘987,654.321’
• paddingNum(-987654.3) // return ‘-987,654.3’
  */
  Test Case
  describe(‘test paddingNum’, () => {
  const tests = [
  { input: 33, output: ‘33’ },
  { input: 1234.56, output: ‘1,234.56’ },
  { input: 123456789, output: ‘123,456,789’ },
  { input: 987654.321, output: ‘987,654.321’ },
  { input: -987654.3, output: ‘-987,654.3’ },
  ]

tests.forEach(test => {
it(test ${test.input}, () => expect(paddingNum(test.input)).to.be.equal(test.output))
})
})
decodeString
/**

• 使用 javascript 实现 decodeString 方法
• @description 给定一个编码字符，按编码规则进行解码，输出字符串
• 编码规则是 count[letter]，将 letter 的内容 count 次输出，count 是 0 或正整数，letter 是区分大小写的纯字母
• @param {String}
• @returns {String} 处理后的字符串
• @example
• decodeString(‘3[a]2[bc]’) // 返回 ‘aaabcbc’
• decodeString(‘3[a2[c]]’) // 返回 ‘accaccacc’
• decodeString(‘2[abc]3[cd[e]]fg’) // 返回 ‘abcabccdecdecdefg’
  */
  Test Case
  describe(‘test decode’, () => {
  const s = ‘3[a]2[bc]’
  it(s, () => expect(decodeString(s) === ‘aaabcbc’).to.be.true)

const s1 = ‘3[a2[c]]’
it(s1, () => expect(decodeString(s1) === ‘accaccacc’).to.be.true)

const s2 = ‘2[abc]3[cd[e]]fg’
it(s2, () => expect(decodeString(s2) === ‘abcabccdecdecdefg’).to.be.true)

const s3 = ‘10[abc]3[cd[e]]fg’
it(s3, () => expect(decodeString(s3) === ‘abcabcabcabcabcabcabcabcabcabccdecdecdefg’).to.be.true)
})