原博客地址
01. 如何开启js严格模式?js严格模式有什么特点?
参考点:js基础知识
参考答案:
// 全局开启
'use stcict'
// 局部开启
function fu(){
'use strict'
}
/*
1.全局变量必须先声明
2.禁止使用with
3.创建eval作用域
4.禁止this指向window
5.函数参数不能重名
*/
// 全局变量必须先声明
let n = 10;
console.log(n);
// 禁止使用with
let obj = { name:'mo' }
with (obj) {
console.log(name);
}
// eval有单独的作用域
let a = 10;
eval(`let a=5; console.log('in eval',a)`);
console.log(a);
// 禁止this指向window
function fn(a,b){
console.log(this);
}
fun();
// 函数参数不能重名令
function fn(x,x,y){}
fn(10,20,30);
连环问:想改变函数的this值,如何操作
function fn(a,b){
console.log(a+b);
}
fn.call(改变的this指向,1,2);
fn.apply(改变的this指向,[1,2]);
// bind不会调用函数,会返回一个新的函数的拷贝
const Fn = fn.bind(改变的this指向,1,2);
Fn();
02. offsetHeight、scrollHeight、clientHeight有什么区别
参考点:盒子模型和JS基础知识
参考答案:
offsetHeight = border + padding + content
scrollHeight = padding + 实际内容大小
clientHeight = padding + content
扩展知识:不要频繁的获取offsetHeight等值,所有DOM操作都很费性能
连环问:
- scrollLeft与scrollTop是什么?
滚动距离
- 如何获取元素距离⻚⾯顶部的距离?
offsetParent.scrollTop + xx.scrollTop
obj.getBoundingClientRect().top
03. HTMLCollection与NodeList区别?
考察点:js DOM基础知识
参考答案:
HTMLCollection 是 Element 集合
obj.children,只包含⼦元素
NodeList 是 Node 集合
obj.childNodes,包含⽂本、注释、空格、换⾏
DOM是⼀棵树,所有节点都是Node
Node是Element的基类
Element是其他HTMLElement的基类
04. 箭头函数有什么缺点?什么时候不能 使⽤箭头函数?
考察点:js基础知识
参考答案:
** 箭头函数的this指向父作用域 **
箭头函数有什么缺点
1.没有 arguments
2.无法通过 call、apply、bind 改变 this
不能使用箭头函数的场景
1.对象方法,不能使用 -> this 指向不正确
2.原型方法 __proto__,不能使用 -> this 指向不正确
3.构造函数,不能使用 -> this 指向不正确
4.动态上下文中使用this,不能使用 -> this 指向不正确
5.vue的生命周期和method,不能使用 -> this 指向不正确
05. for..in 与 for..of 有什么区别?
考察点:js基础知识、考察ES6基本功
参考答案:
for..in 遍历得到key,可以遍历对象,不可以遍历 Set和Map
for..of 遍历得到value,不可以遍历对象,可以遍历 Set 和 Map
[扩展]
可枚举 与 可迭代
for...in ⽤于可枚举的数据:对象、字符串、数组、类数组
for...of ⽤于可迭代的数据:Set、Map
可枚举 Object.getOwnPropertyDescriptors(obj)
enumerable: true
可迭代 arr[Symbol.iterator]()
有没有next
扩展知识点:
06. typeOf 可以判断哪些类型?
考察点:typeOf的使⽤
参考答案:
undefined
string
number
boolean
function
object
symbol
07. 阅读代码,填写结果
console.log('我的年龄是' + 18 + 1) // 我的年龄是181
console.log(100 == '100') // true
console.log(0 == '') // true
console.log(0 == false) // true
console.log(false == '') // true
console.log(null == undefined) // true
考察点:隐式类型转换
08. 何时使⽤ == ?何时使⽤ === ?
考察点:编程能⼒
参考答案:
eslint Visual Code检查语法插件
除了 if (obj.a == null) 使⽤ == 之外,全部⽤ ===
if (obj.a === null || obj.a === undefined )
09. 阅读代码,填写结果
let a1=10;
let b1=a1;
b1=100;
console.log(a1); // 此时 a1 的值是多少?
let a2={age: 18};
let b2=a2;
b2.age=20;
console.log(a2); // 此时 a2.age 的值是多少?
考察点:值类型与引⽤类型
参考答案:
【值类型】
赋值后,⼊栈,不会互相⼲扰
常⻅值类型:undefined、string、bumber、boolean、symbol
【引⽤类型】
会互相⼲扰
常⻅引⽤类型:对象{a:10}、数组[1, 2, 3]、null
扩展阅读: Symbol⽂档
10. ⼿写深拷⻉函数
考察点:编程能⼒、递归、原型链
const obj = {
name: "默永",
age: 18,
address: {
city: "beijing"
}
hobby: ["羽毛球","游戏"]
}
function deepClone(obj = {}){
if(typeof obj !== "object" || obj == null) {
return obj;
}
let result;
if(obj instanceof Array) {
result = [];
}else{
result = {};
}
for(let key in obj) {
if (obj.hasOwnProperty(key)) { // 判断obj是否有相对应属性
result[key] = deepClone(obj[key]);
}
}
return result;
}
标签:面试题,obj,log,JavaScript,基础,let,考察点,console,参考答案
From: https://www.cnblogs.com/Lmyong/p/16822348.html