前两天面试了虾皮，记录一些有意思的题目

(function(){
    var x = y = 1; // 拆分一下就是 var x = 1; y = 1;
})();

console.log(y); // 1
console.log(x); // Err

正常情况在函数外部是无法访问到函数内部的变量的，所以输出x会报错；

输出y为1是因为声明y的时候没有使用var，y会成为全局变量，这样的方式会造成内存泄漏

function Foo() {
  this.getValue = function() {
    console.log(2);
  }
}

Foo.prototype.getValue = function() {
  console.log(3)
} 

function Foo2() {}

Foo2.getValue = function() { // 定义到了Foo2构造函数上，他的实例无法访问到
  console.log(5);   
}

Foo2.prototype = Foo.prototype
const obj2 = new Foo2();
obj2.getValue(); // 3   // Foo2构造函数上没有，会去他的构造函数的原型 Foo.prototype上找

访问实例上的属性和方法，实例的构造函数上没有，回去他的原型对象上找

var A = function() {};
A.prototype.n = 1;
var b = new A(); // 实例化b的时候A的原型上只有n = 1
A.prototype = {
 n: 2,
 m: 3
}
var c = new A();

console.log(b.n); // 1
console.log(b.m); // undefined
console.log(c.n); // 2
console.log(c.m); // 3




function Test() {}  // Test是通过Function实例化出来的

Object.prototype.printName = function() {
 console.log('Object');
}

Function.prototype.printName = function() {
 console.log('Function');
}

Test.printName(); // Function

var obj = new Test();
obj.printName(); // Object  
// Test构造函数上没有这个方法，会去Test原型对象上找，原型对象也没有，原型对象的原型是Object.prototype

function Parent(){
   this.a = 'Parent'
}

function Tom() {
   this.a = 'Tom'
}

Parent.__proto__.print = function(){ // Parent.__proto__ === Function.prototype
   console.log(this.a)
}

Parent.print()
Tom.print() // print方法添加到了Function的原型上，所以可以访问到

var child = new Parent()
child.print() // Parent.prototype.__proto__ === Object.prototype
// Parent构造函数没有print方法，构造函数的原型上也没有，原型的原型上也没有，找到了终点都没找到，所以报错

执行以上代码，将分别输出什么？（请勿使用浏览器开发者工具调试） D

A. 'undefined' 'Uncaught TypeError ...' 'Parent'
B. 'Parent' 'Uncaught TypeError ...' 'Uncaught TypeError ...'
C. 'Parent' 'Tom' 'Uncaught TypeError ...'
D. 'undefined' 'undefined' 'Uncaught TypeError ...'

async function fetchData(){
    return await new Promise((resolve, reject)=>{
        setTimeout(reject, 1000)
    })
}

try{
    fetchData()
    console.log('success')

}catch(e){
    console.log('error')
}

// success
// try catch 捕获不到Promise的错误
// promise 内部的抛出的错误，不会反映到外部

promise 返回的是一个新的promise,promise的状态不受外界影响，一旦改变就不会再变

new Promise((resolve, reject) => {
    setTimeout(() => resolve(123), 1000);
})
.then((res) => {
    console.log("1", res);
    return 456;
})
.then((res) => {
    console.log("2", res);
    return Promise.resolve(789);
})
.then((res) => {
    console.log("3", res);
    throw 56;
})
.then((res) => console.log("4", res))
.catch((err) => console.log("err", err));
 
// 1 123    2 456   3 789   err 56

let foo={}

let obj = {}

foo[obj]='hello' // js Object对象的key只能是字符串, 所以会进行一个隐示转换为[Object Object]

let obj2 = {a:1}

foo[obj2] = 'hello2' // Object的key不能重复，后声明的会覆盖前边的

console.log(foo[obj], foo[obj2]) // 'hello2' 'hello2'

interface Person {

 name: string;

 age: number;

 location: string;

}

type demo = keyof Person;

demo类型是什么 // 'name' | 'age' | 'location'
 

function strEnum<T extends string>(o: Array<T>): { [K in T]: K } {

}

ts中的keyof和in www.cnblogs.com/plBlog/p/15…

问题：给定一个字符串，请你找出其中不含有重复字符的 最长子串 的长度。

// 输入: "abcabcbb"

// 输出: 3 

// 解释: 因为无重复字符的最长子串是 "abc"，所以其长度为 3。

 

const lengthOfLongestSubstring = s => {
  let num = 0;
  let res = 0;
  let m = '';
  for (n of s) {
    if (m.indexOf(n) == -1) {
      m += n;
      num++;
      res = res < num ? num: res;
    } else {
      m += n;
      m = m.slice(m.indexOf(n)+1);
      num = m.length;
    }
  }
  return res;
};

总结

1 js作用域

2、3、4主要考察了js原型和原型链

5、6主要考察了promise

7 object对象key的隐示转换

8 ts的keyof和in

9 算法

【虾皮面经】2022年4月前端面试

总结