【八股文】---前端面试经验总结

前言

一、HTML+CSS

基础知识https://zhuanlan.zhihu.com/p/28415923

• HTML与CSS基础总结
• 一. 认识WEB
  • 1.浏览器的分类和内核
  • 2.图解web标准
• 二. HTML基础
  • 1.文档类型
  • 2.页面语言lang
  • 3. 字符集
  • 4.标签语义化
  • 5.锚点定位
  • 6.base 标签
  • 7.特殊符号
• 三. CSS选择器
  • 1.三种样式表总结
  • 2.CSS基础选择器
  • 3.font字体
  • 4.CSS外观属性总结
  • 5.链接伪类选择器
  • 6.复合选择器总结
  • 7.背景总结
• 四. CSS的三大特性
  • 1.层叠性
  • 2.继承性
  • 3.优先级
• 五. CSS布局问题与边框阴影样式
  • 1.外边距合并
  • 2.圆角边框
  • 3.盒子阴影和文字阴影

二、JavaScript基础

1. 数据类型

在 JS 中共有 8 种基础的数据类型，分别为： Undefined 、 Null 、 Boolean 、 Number 、 String 、 Object 、 Symbol 、 BigInt 。

• Symbol 代表独一无二的值，最大的用法是用来定义对象的唯一属性名。
• BigInt 可以表示任意大小的整数。

区别

• 值类型是直接存储在**栈（stack）**中的简单数据段，占据空间小、大小固定，属于被频繁使用数据，所以放入栈中存储；
• 引用类型存储在**堆（heap）**中的对象，占据空间大、大小不固定。如果存储在栈中，将会影响程序运行的性能；

数据类型的判断

1. typeof：能判断所有值类型，函数。不可对 null、对象、数组进行精确判断，因为都返回 object 。

   console.log(typeof undefined); // undefined
   console.log(typeof 2); // number
   console.log(typeof true); // boolean
   console.log(typeof "str"); // string
   console.log(typeof Symbol("foo")); // symbol
   console.log(typeof 2172141653n); // bigint
   console.log(typeof function () {}); // function
   // 不能判别
   console.log(typeof []); // object
   console.log(typeof {}); // object
   console.log(typeof null); // object
   

2. instanceof：能判断对象类型，不能判断基本数据类型，其内部运行机制是判断在其原型链中能否找到该类型的原型。

   console.log(typeof undefined); // undefined
   console.log(typeof 2); // number
   console.log(typeof true); // boolean
   console.log(typeof "str"); // string
   console.log(typeof Symbol("foo")); // symbol
   console.log(typeof 2172141653n); // bigint
   console.log(typeof function () {}); // function
   // 不能判别
   console.log(typeof []); // object
   console.log(typeof {}); // object
   console.log(typeof null); // object
   

3. Object.prototype.toString.call()：所有原始数据类型都是能判断的，还有 Error 对象，Date 对象等。

Object.prototype.toString.call(2); // "[object Number]"
Object.prototype.toString.call(""); // "[object String]"
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(Math); // "[object Math]"
Object.prototype.toString.call({}); // "[object Object]"
Object.prototype.toString.call([]); // "[object Array]"
Object.prototype.toString.call(function () {}); // "[object Function]"

如何判断变量是否为数组

Array.isArray(arr); // true
arr.__proto__ === Array.prototype; // true
arr instanceof Array; // true
Object.prototype.toString.call(arr); // "[object Array]"

2. 数组去重

1. indexOf 循环去重
2. ES6 Set 去重；Array.from(new Set(array))
3. Object 键值对去重；把数组的值存成 Object 的 key 值，比如 Object[value1] = true， 在判断另一个值的时候，如果 Object[value2]存在的话，就说明该值是重复的。

3.闭包

什么是闭包

闭包是指有权访问另外一个函数作用域中的变量的函数。 闭包就是函数的局部变量集合，只是这些局部变量在函数返回后会继续存在。闭包就是 就是函数的“堆栈”在函数返回后并不释放，我们也可以理解为这些函数堆栈并不在栈 上分配而是在堆上分配。当在一个函数内定义另外一个函数就会产生闭包。

为什么要用闭包

匿名自执行函数：我们