javascript面试宝典

js 中数据是怎么存储的

js的数据分为两种, 一种是原始类型(Boolean,Null,Undefined,Number,BigInt,String,Symbol), 一种是对象(Object)。 原始类型的数据放在栈中,对象的数据放在堆中。

堆栈的区别

堆(heap)是不连续的内存区域,即数据可以任意存放, 主要存放的是对象等。 ( 栈(stack)是一块连续的内存区域,每个区块按照一定次序存放(后进先出),栈中主要存放的是基本类型的变量的值以及指向堆中的数组或者对象的地址。

为什么要区分堆栈

变量主要是两种形式:

一种内容短小(比如一个int整数),需要频繁访问,但是生命周期很短,通常只在一个方法内存活.

而另一种内容可能很多(比如很长一个字符串),可能不需要太频繁的访问,但生命周期较长,通常很多个方法中可能都要用到,那么自然将这两类变量分开就显得比较理性.

一类存储在栈区,通常是局部变量、操作符栈、函数参数传递和返回值。

另一类存储在堆区,通常是较大的结构体(或者OOP中的对象)、需要反复访问的全局变量。

堆区就是各种慢,申请内存慢,访问慢,修改慢,释放慢,整理慢(或者说GC垃圾回收),但优点也不言而喻,访问随机灵活,空间超大,在不超可用内存的情况下你要多大就给多大。

栈区就像临时工,干完就跑,所以超快,但是缺点也很多,比如生命周期短,一般只能在一个方法内存活,又比如你需要事先知道需要多大的栈(事实上绝大多数语言栈区要分配的大小编译期就确定了,Java就是这样),而且通常最大栈区可用内存都很小,你不可能往栈区里堆很多数据。

说说你对模块化方案的理解,比如 CommonJS、AMD、CMD、ES Module 分别是什么?

时间轴:CommonJS AMD CMD ES Module

CommonJS 常用于:服务器端,node,webpack 特点:同步/运行时加载,磁盘读取速度快 语法:

// 1. 导出:通过module.exports或exports来暴露模块  
module.exports = {  
  attr1,  
  attr2  
}  
exports.attr = xx  

注意

不可以exports = xxx,这样写会无效,因为更改了exports的地址 而 exports 是 module.exports 的引用指向的是同一个内存,模块最后导出的是module.exports

// 2. 引用:require('x')  
const xx = require('xx') // 整体重命名  
const { attr } = require('xx') // 解构某一个导出

https://fe.ecool.fun/topic/f5f2f81e-c0c8-409e-ba00-3f3428ae535b?orderBy=updateTime&order=desc&tagId=10

其他

说说你对SPA的理解

单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。

img

  1. SPA和MPA的区别

上面大家已经对单页面有所了解了,下面来讲讲多页应用MPA(MultiPage-page application),翻译过来就是多页应用在MPA中,每个页面都是一个主页面,都是独立的当我们在访问另一个页面的时候,都需要重新加载html、css、js文件,公共文件则根据需求按需加载如下图

img

单页应用与多页应用的区别

单页面应用(SPA)多页面应用(MPA)
组成一个主页面和多个页面片段多个主页面
刷新方式局部刷新整页刷新
url模式哈希模式历史模式
SEO搜索引擎优化难实现,可使用SSR方式改善容易实现
数据传递容易通过url、cookie、localStorage等传递
页面切换速度快,用户体验良好切换加载资源,速度慢,用户体验差
维护成本相对容易相对复杂

单页应用优缺点

优点:

  • 具有桌面应用的即时性、网站的可移植性和可访问性
  • 用户体验好、快,内容的改变不需要重新加载整个页面
  • 良好的前后端分离,分工更明确

缺点:

  • 不利于搜索引擎的抓取
  • 首次渲染速度相对较慢

如何给SPA做SEO

SSR服务端渲染 将组件或页面通过服务器生成html,再返回给浏览器,如nuxt.js

服务端渲染 (SSR)

什么是 SSR?

服务端渲染 SSR (Server-Side Rendering),是指在服务端完成页面的html 拼接处理, 然后再发送给浏览器,将不具有交互能力的html结构绑定事件和状态,在客户端展示为具有完整交互能力的应用程序。