1.什么是面向对象
- 是一种思维方式,只注重结果
2.面向对象和面向过程的区别
拿吃炒饭为例
面向过程的方式 需要先买米、淘米、蒸熟、放锅里翻炒、 加调料、加配菜、炒熟后放碗里再吃。
面向对象 只需要在美团订购一份炒饭,等送到后直接可以吃, 不需要考虑炒饭是如何制作的,只需要调用美团提供的方法。
虽然不用考虑过程,但实际上是有这个过程的, 我们调用美团的方法时,在美团内部 某个商家执行了这个过程。
3.什么是原型对象 有什么用
- 任何函数创建的时候,系统都会自动创建一个对象,这个对象称为原型对象
- 减少内存消耗,解决全局变量名污染
- 原型对象相当于构造函数内部的公共空间,仅限构造函数和它实例化的对象访问
- 不管实例对象有多少个,对应的原型对象只会有一个,所以调用原型对象的属性和方法 消耗的内存很小
4.new的执行原理
- 创建一个空对象
- this指向这个空对象
- 执行函数内部代码,给空对象赋值
- 返回这个对象
5.构造函数 原型对象 实例对象 这三者之间的关系
- 构造函数.prototype === 原型对象
- 原型对象.constructor === 构造函数
- 实例对象.__proto__ === 原型对象
- 以此类推,实例对象想找到自己的构造函数需要通过原型对象来找
- 实例对象.__proto__.constructor === 构造函数
6.构造函数手动添加return有效吗
分情况
- 如果return的是值类型 - 无效
- return的是引用类型 - 有效,会覆盖默认的返回值
7.面向对象的三大特征
- 封装:将多次使用的功能放到对象的方法中
- 继承:一个对象拥有另一个对象的所有属性和方法
- 多态:对象在不同状态的下表现形式不同
8.js是如何实现继承的
原型链,将父对象放到子对象构造函数的原型里,此时子对象就会继承父对象所有属性和方法
9.简单说说原型链
-
原型链是一种链式结构,每个对象都有对应的原型对象,而原型对象也有自己的原型对象,以此类推 就形成了链式结构
-
当我们访问对象的属性和方法时,首先会在自身上找,找不到的话再去自己的原型对象上找,一直顺着原型链的结构来找, 直到找到Object对象,Object没有那是真没有了,Object的原型是null.
-
如果是访问的属性 返回undefined , 访问的方法返回 XXX is not function
10.内置对象和DOM对象的原型链
- 内置对象的原型链都是三层。
- 内置实例对象.__proto__ === 内置对象构造函数.prototype
- 内置实例对象.__proto__.__proto__ === Object.prototype
- DOM对象的原型链都是七层。
11.instanceof原理
实例对象 instanceof 构造函数
判断右边的构造函数的原型对象 是否在左边实例对象的原型链当中
12.for-in 和 for-of的区别
- for-in只遍历下标,for-of只遍历元素
- for-in可以遍历原型,for-of不会遍历原型
- for-in可以遍历Object,for-of不能遍历Object
13.环境对象this的三种指向
- 普通函数 this指向window
- new构造函数 this指向实例化的对象
- 对象.函数 this指向这个对象
14.上下文调用方法 call apply bind 三者区别
-
相同点:都能改变this指向
-
不同点:
1.传参方式不同, call是单个传参, apply是传递数组或伪数组
2.执行方式不同, call和apply是立即执行,bind不会立即执行,而是返回一个改变this指向的新函数
15.万能数据检测原理
- Object.protetype.toString() 会返回this的数据类型 , 固定字符串格式 [object Object]
- 加上.call(数据) 改变this指向, 就能返回指定数据的类型 例如: [object String] [object Null] [object Array] [object Function]
16.变量和字面量的区别
- 变量:是一种内存空间,只有存储功能,没有运算功能
- 字面量:是一种数值,只有运算功能 没有存储功能
17.闭包是什么,有什么作用
是什么↓
- 是访问其他函数内部遍变量的函数
- 闭包 = 函数 + 上下文引用 作用: 解决变量名污染,一般用于回调函数
18.什么是递归,有什么用
在函数中调用自己
作用: 深拷贝 / 遍历树结构的数据
19.ajax工作原理/流程
设置请求报文的过程
- 创建XMLHttpRequest对象
- 设置请求方式和地址
- (post请求还需要设置固定的请求头)
- 发送请求
- 注册响应事件
20.什么是json
是一种格式,解决数据跨平台传输
21.ajax的五种状态
XMLHttpRequest对象的ReadyState属性有 0~4 一共五种状态
- 0 => XMLHttpRequest对象创建后
- 1 => 建立链接
2 3 4都在onload事件里
- 2 => 接收
- 3 => 处理
- 4 => 响应
22.get和post有什么区别
- 传参方式不同: get参数在请求行,post参数在请求体
- 安全性不同: get不安全,参数都暴露在地址中; post相对安全,请求参数看不到
- 大小不同: get传参有上限,大概是2~5m; post理论上没有上限,但可能会被其他环境限制体积,比如IIS 默认只有200k, 不够用的话得手动修改设置
- 速度不同: get是一次性传输,post是多段传输
23. 说说常见的几种状态码
- 2XX:请求成功
- 3XX:重定向
- 4XX:客户端错误
- 5XX:服务端错误
- 200 请求成功/204 持续请求中
- 302 重定向
- 400 参数错误/404 地址错误
- 500 服务器内部错误 一般是后台代码写错/503 服务器负载过高 并发过高
24.网页从输入url到呈现过程
- DNS解析,将域名解析成IP
- TCP三次握手,确保请求安全可靠
- 客户端~服务端 确认客户端到服务器的连接是否正常
- 确认服务端到客户端的连接是否正常
- 客户端连接服务端 准备正式传输请求报文
- Http连接
- 客户端发送请求到服务端
- 服务端接收请求
- 服务端响应数据到客户端
- 渲染引擎将响应数据渲染成页面
- 解析html为DOM树
- 解析css成样式树
- 合并成渲染树
- 绘制渲染树
- 呈现出来
25.说说防抖和节流
- 防抖: 单位时间内多次触发事件 , 只让最后一次生效
- 应用场景: 搜索框 输入内容即时触发
- 节流: 单位时间内多次触发事件只生效一次 , 超过指定时间才能再次触发
- 应用场景: 滚动加载/按钮点击限制频率
26.同步和异步的区别
- 顺序不同, 异步是无序的,同步是有序的且优先执行
- 效率不同, 异步不会阻断主线程(效率高),同步会阻断(效率低)
- 代码不同, 异步一般有回调,同步一般没有回调
27.什么是跨域
- ajax请求和当前页面地址不同源,就叫做跨域
- 同源:协议/IP/端口 全都相同
28.如何解决跨域
- CORS技术, 是当前流行的方案, 只需要后端设置跨域响应头
- jsonp技术,以前用得多, 现在基本已经淘汰,原理和流程过于复杂
29.web性能如何优化
- 减少http链接,例如精灵图技术
- 压缩资源,引用的外部资源都用min格式,多个css文件导到一个css文件里
- 合理的利用缓存技术,后端设置缓存响应头,或者redis数据库
30.三种模块导入方式
- 内置 直接写模块名.安装Node.js时自动安装
- 第三方 直接写模块名, npm命令安装
- 自定义 写文件路径
31.express用法
- 导入express模块
- 创建服务器对象
- 托管静态资源
- 设置路由接口
- 启动服务器
32.promise是什么,有什么用
- 是ES6新增一种构造函数,用于创建promise实例对象
- 异步编程的一种解决方案, 主要是是用来解决回调地狱的问题
33.promise原理
- 本质上是一个容器
- 它有三种工作状态 , 进行中pending 已完成fulfilled 已失败rejected
- 工作状态的切换只会有两种:进行中到已完成,进行中到已失败
- promise创建的时候内部的代码会立即执行
- 解决回调地狱的原理:在上一个promised对象的then方法中,返回下一个promise对象
34.promise流程
- 创建promise对象,传一个回调函数,函数有两个参数,resolve和reject ,内部的异步代码成功执行就用resolve传递响应信息,错误执行就用reject传递响应信息
- promise的实例对象点then方法 处理成功响应的数据, 点catch方法处理错误响应的数据
35.webpack是什么
webpack是一个静态模块打包工具
36.webpack默认入口和默认出口
- 默认入口:src目录下的index.js文件
- 默认出口:dist目录下的main.js文件
37.webpack使用流程
- 初始化npm
- 安装webpack
- 执行打包命令
38.webpack中 npm run build 做了哪些事
- 检测自定义命令是否存在
- 初始化参数执行真正的命令
- 检测是否用默认配置
- 通过配置参数找到入口文件
- 解析各个模块和入口文件之间的依赖关系
- 编译压缩成一个文件
- 最后将文件内容写入到指定的出口文件里
39. 作用域/预解析
- 作用域:就是变量的有效范围
- 预解析: 将变量和函数的声明提升到当前作用域的最上面. 变量只声明不赋值, 获取到是undefined, 函数提升优先级大于变量提升.
40.require 和 import 的区别
- require 是CommonJs的语法规范
- import 是ES6的语法规范
41.事件流 / 事件冒泡 / 事件捕获
- 当页面触发事件的时候, 按照一定顺序响应事件, 这个过程叫事件流
- 事件冒泡: 事件从子元素传递到父元素的过程
- 事件捕获: 事件从父元素传递到子元素的过程
42. 事件委托
- 将目标节点的事件绑定到祖先元素上