One side (niuke video interview)

1. To introduce myself
2. I asked about the specific implementation of the two projects and mentioned whether I had known some knowledge of the latest Vue3
3. What is the Better Scroll package used in the project mainly used for (to achieve a spring effect when dragging to the bottom/top), and the implementation principle of this effect?
4. Ask the output of two logs:

var name = 'x'
var people = {
  name: 'y'.setName: (name) = > {
    this.name = name
    return () = > {
      return this.name
    }
  }
}

var getName = people.setName(name)
console.log(people.name) // y
console.log(getName()) // x
Copy the code

5. Log output sequence (Event Loop) :

console.log('start')
setTimeout(() = > {
  console.log('timer1')
  Promise.resolve().then(function () {
    console.log('promise1')})},0)
setTimeout(() = > {
  console.log('timer2')
  Promise.resolve().then(function () {
    console.log('promise2')})},0)
Promise.resolve().then(function () {
  console.log('promise3')})console.log('end')
// start - end - promise3 - timer1 - promise1 - timer2 - promise2
Copy the code

6. Let /const,… , ()=>{}, Promise, async/await (Promise, async/await)
7. CSS selector weight priority? important>style>id>class>tag>wildcard
8. Briefly describe the CSS box model. content/padding/border/margin
9. How to set up two box models, which box model is more common? box-sizing: border-box/content-box;
10. Use Flex to create a CSS two-column layout with a fixed width of 200px on the left and adaptive on the right. Flex is the abbreviation of which three attributes, flex-grow flex-shrink flex-basis; What is the difference between Flex-basis and width?
11. What do you know about git commands? add/commit/push/clone/merge/reset
12. Is HTTPS symmetric or asymmetric encryption?
13. Front-end cross-domain mode. Proxy, JSONP, CORS, and WebSocket
14. Why are there cross-domain restrictions? How does CORS ensure safety? Does CORS carry cookies by default?
15. Negotiation cache and strong cache for front-end static resources?
16. Algorithm: Numbers formatted in thousandths

// Implement thousandths
// 1234567 => 1,234,567
function format (num) {
    const list = (num + ' ').split(' ');
    let count = 0;
    for(let i = list.length - 1; i >= 0; i--) {
        count++;
        if (count === 3) {
            list.splice(i, 0.', ');
            count = 0; }}return list.join(' ');
}
console.log(format(1234567));
Copy the code

17. Algorithm problem: valid parentheses

Given a string containing only ‘(‘, ‘)’, ‘{‘, ‘}’, ‘[‘, ‘]’, check whether the string is valid.

A valid string must meet the following requirements:

• An open parenthesis must be closed with a close parenthesis of the same type.
• The left parentheses must be closed in the correct order.

// ()[] true
// ({}) true
// ({)} false
/ * * *@param {String} str
* @returns {Boolean}* /
function isValid(str) {
    if(! str.length || str.length %2! = =0) return false;
    const stack = [];
    const map = {
        ') ': '('.'} ': '{'.'] ': '['};for(let i = 0; i < str.length; i++) {
        if(! map[str[i]]) { stack.push(str[i]); }else if(map[str[i]] === stack[stack.length - 1]) { stack.pop(); }}return! stack.length; }console.log(isValid('({})))
Copy the code