JavaScript基础面试题汇总 #

typeof ''; // string 有效
typeof 1; // number 有效
typeof true; //boolean 有效
typeof undefined; //undefined 有效
typeof null; //object 无效
typeof []; //object 无效
typeof new Function(); // function 有效
typeof new Date(); // object 无效
typeof new RegExp(); // object 无效

[] instanceof Array; //true
{} instanceof Object; //true
new Date() instanceof Date; //true

var arr = [];
var obj = {};
var date = new Date();
var num = 110;
var str = 'Hello';
var getName = function() {};
var sym = Symbol();
var set = new Set();
var map = new Map();

arr.constructor === Array; // true
obj.constructor === Object; // true
date.constructor === Date; // true
str.constructor === String; // true
getName.constructor === Function; // true
sym.constructor === Symbol; // true
set.constructor === Set; // true
map.constructor === Map // true

Object.prototype.toString.call(''); // [object String]
Object.prototype.toString.call(1); // [object Number]
Object.prototype.toString.call(true); // [object Boolean]
Object.prototype.toString.call(undefined); // [object Undefined]
Object.prototype.toString.call(null); // [object Null]
Object.prototype.toString.call(new Function()); // [object Function]
Object.prototype.toString.call(new Date()); // [object Date]
Object.prototype.toString.call([]); // [object Array]
Object.prototype.toString.call(new RegExp()); // [object RegExp]
Object.prototype.toString.call(new Error()); // [object Error]

function f(name) {
  this.name = name
}
var f1 = new f("martin")
console.log(Object.prototype.toString.call(f1)) //[object Object]

Array.isArray([1, 2, 3, 4])  // true
Array.isArray('1234')  // false

Object.getPrototypeOf(a) === Array.prototype // true
Object.setPrototypeOf(a, Object.prototype);
Object.getPrototypeOf(a) === Array.prototype // false

Array.prototype.isPrototypeOf([1, 2, 3]) // true

console.log('script start') //1. 打印 script start

setTimeout(function() {
  console.log('settimeout') // 4. 打印 settimeout
}) // 2. 调用 setTimeout 函数，并定义其完成后执行的回调函数

console.log('script end') //3. 打印 script start

// 输出顺序：
// ->script start
// ->script end
// ->settimeout

console.log('normal')
setTimeout(() => {
  console.log('setTimeout1')
})
let promise1 = new Promise((resolve) => {
  console.log('promise1')
  resolve()
  console.log('promise1 end')
}).then(function() {
  console.log('promise2')
})
setTimeout(function() {
  console.log('settimeout2')
})
console.log('normal end')
// 输出顺序: 
// normal
// promise1
// promise1 end
// normal end
// promise2
// settimeout1
// settimeout2

async function async1() {
  console.log('async1 start');
  await async2(); // 等待async2()完成，此时会继续执行主程序，输出script end，等async2()完成后，再回到async1()中继续执行剩下的代码
  console.log('async1 end')
}
async function async2() {
  console.log('async2')
}
console.log('script start');
async1();
console.log('script end')

// 输出顺序：
// script start
// async1 start
// async2
// script end
// async1 end

// 举个例子
async function func1() {
  return 1
}
console.log(func1())

func1().then(res => {
  console.log(res); // 30
})

process.nextTick(function A() {
  console.log(1);
  process.nextTick(function B(){
    console.log(2);
  });
});

setTimeout(function C() {
  console.log(3);
}, 0)
// 1
// 2
// 3

setTimeout(function C() {
    console.log(3);
}, 0)
process.nextTick(function A() {
  console.log(1);
  process.nextTick(function B(){
    console.log(2);
  });
});
// 1
// 2
// 3

setTimeout(function C() {
  console.log(3);
}, 0)
process.nextTick(function A() {
  process.nextTick(function B(){
    console.log(2);
  });
  console.log(1);
});
// 1
// 2
// 3

foo = function(bar) {
  console.log(bar);
  return process.nextTick(function() {
    return f(bar + 1);
  });
};
setImmediate(function () {
  console.log('1001');
});
foo(1);//注意这样不会输出1001，当递归执行到1000次是就会报错exceed callback stack，

setTimeout(function(){
  console.log('0')
}, 0);// 意思是回调函数加入事件队列的队尾，主线程和事件队列的函数执行完成之后立即执行定时器的回调函数，如果定时器的定时是相同的，就按定时器回调函数的先后顺序来执行。
console.log(1);
setTimeout(function(){
  console.log(2);
}, 1000);
setTimeout(function(){
  console.log(4);
}, 1000);
console.log(3);
//1 3 0 2 4

console.log('1');

setImmediate(function () {
  console.log('2');
});

setTimeout(function () {
  console.log('3');
}, 0);

process.nextTick(function () {
  console.log('4');
});
//1 4 2 3也可能是1 4 3 2

function Person(name) {
  this.name = name
}
const person = new Person('张三')
console.log(person.__proto__ === Person.prototype) // true
console.log(Object.getPrototypeOf(person) === Person.prototype) // true
console.log(person.constructor === Person) // true
console.log(Person.prototype.constructor === Person) // true

var a = {
  name: '张三'
}
console.log(a.__proto__ === Object.prototype) // true
console.log(Object.getPrototypeOf(a) === Object.prototype) // true

function Foo(){};
var f1 = new Foo;

function Foo(){};
var f1 = new Foo;
var f2 = new Foo;
console.log(f1 === f2);//false

function Foo(){};
Foo.prototype.a = 1;
var f1 = new Foo;
var f2 = new Foo;

console.log(Foo.prototype.a); // 1
console.log(f1.a); //1
console.log(f2.a); // 1
console.log(f1.__proto__ === f2.__proto__) // true

function Foo(){};
console.log(Foo.prototype.constructor === Foo);//true

function Foo(){};
var f1 = new Foo;
console.log(f1.constructor === Foo);//true

function Foo(){};
var f1 = new Foo;
console.log(f1.__proto__ === Foo.prototype);//true

function Animal (type) {
  this.type = type
}
Animal.prototype.say = function() {
  console.log('i am a ' + this.type)
}
function Cat (name) {
  this.name = name
}
Cat.prototype = new Animal('animal')

const cat = new Cat('cat')
console.log(cat.type, cat.name)  // animal cat
cat.say() // i am a animal

function Animal (type) {
  this.type = type
}
Animal.prototype.say = function() {
  console.log('i am a ' + this.type)
}
function Cat (type) {
  Animal.call(this, type)
}

const cat = new Cat('cat')
console.log(cat.type)
cat.say() // TypeError: cat.say is not a function

function Animal (type) {
  this.type = type
}
Animal.prototype.say = function () {
  console.log('i am a ' + this.type)
}
function Cat (type) {
  Animal.call(this, type)
}
Cat.prototype = new Animal('animal')
const cat = new Cat('cat')
console.log(cat.type) // cat
cat.say() // i am a cat

function Animal (type) {
  this.type = type
}
Animal.prototype.say = function () {
  console.log('i am a ' + this.type)
}
function Cat (type) {
  Animal.call(this, type)
}
Cat.prototype = Object.create(Animal.prototype)
Cat.prototype.constructor = Cat
const cat = new Cat('cat')
console.log(cat.type) // cat
cat.say() // i am a cat

function Animal (type) {
  this.type = type
}
Animal.prototype.say = function () {
  console.log('i am a ' + this.type)
}
function Cat (type) {
  const animal = new Animal('animal')
  for (let key in animal) {
    Cat.prototype[key] = animal[key]
  }
  this.type = type
}
const cat = new Cat('cat')
console.log(cat.type) // cat
cat.say() // i am a cat

function Animal (type) {
  this.type = type
}
Animal.prototype.say = function () {
  console.log('i am a ' + this.type)
}
function Cat (type) {
  const animal = new Animal('animal')
  animal.type = type
  return animal
}
const cat = new Cat('cat')
console.log(cat.type) // cat
cat.say() // i am a cat

class Animal {
  constructor(type) {
    this.type = type;
  }
  say() {
    console.log('i am a ' + this.type);
  }
}

class Cat extends Animal {
  constructor(type) {
    super(type);
  }
}
let cat = new Cat('cat');
console.log(cat.type); // cat
cat.say(); // i am a cat

let a = 9
console.log(a) // 9
for (let i = 0; i < 2; i++) {
  console.log(a, i) // 9 0, 9 1
}
function demo () {
  console.log(a) // 9
}

let a = 9
console.log(a) // 9

function demo () {
  let a = 10
  console.log(a) // 10
  console.log(b) // Uncaught ReferenceError: b is not defined
  return function test () {
    let b = 3
    console.log(a) // 10
    console.log(b) // 3
  }
}
demo()()

var a = 11
function demo () {
  let a = 1
  console.log(a)
}
demo() // 1

var a = 11
function demo () {
  console.log(a)
}
demo() // 11

function demo () {
  console.log(a)
}
demo() // Uncaught ReferenceError: a is not defined

console.log(a) // undefined
var a = 1
console.log(a) // 1

// 等价于
var a = undefined
console.log(a)
a = 1
console.log(a)

if (true) {
  var a = 1
  console.log(a) // 1
}
console.log(a) // 1

// 等价于
var a = undefined
if (true) {
  a = 1
  console.log(a)
}
console.log(a)

(() => {
  var a = 1 // Uncaught ReferenceError: a is not defined
})();
console.log(a)

demo()
function demo () {
console.log('aa') // aa
}

// 函数表达式和具名函数表达式标识符都不会提升
test(); // TypeError test is not a function
log(); // TypeError log is not a function
var test = function log() {
  console.log('test')
}

// 同名函数声明，后面的覆盖前面的
test(); // 2
function test() {
  console.log(1);
}
function test() {
  console.log(2);
}

// 函数声明的提升，不受逻辑判断的控制
// 注意这是在ES5环境中的规则，在ES6中会报错
function test() {
  log();
  if (false) {
    function log() {
      console.log('test');
    }
  }
}
test(); // 'test'

// 定义
fn.apply('this指向', [参数一, 参数二, 参数三, ... , 参数n])

function fn (...args) {
  console.log('this:', this)
  console.log('args:', args)
  return { name: '小黑', age: 12 }
}
const obj = {
  name: '张三'
}
const res = fn.apply(obj, ['小三', 24]) // this指向传入的obj 
console.log(res) // { name: '小黑', age: 12 }
// this: { name: '张三' }
// args: [ '小三', 24 ]
fn('小三', 24) // this指向window