常见前端面试之VUE面试题汇总十

 常见前端面试之VUE面试题汇总十_第1张图片

 28. Vuex 和 localStorage 的区别

(1)最重要的区别

vuex 存储在内存中

localstorage 则以文件的方式存储在本地,只能存储字符串类型的 数据,存储对象需要 JSON 的 stringify 和 parse 方法进行处理。 读 取内存比读取硬盘速度要快

(2)应用场景

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集 中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一 种可预测的方式发生变化。vuex 用于组件之间的传值。

localstorage 是本地存储,是将数据存储到浏览器的方法,一般是 在跨页面传递数据时使用 。

Vuex 能做到数据的响应式,localstorage 不能

(3)永久性

刷新页面时 vuex 存储的值会丢失,localstorage 不会。

注意:对于不变的数据确实可以用 localstorage 可以代替 vuex,但 是当两个组件共用一个数据源(对象或数组)时,如果其中一个组件 改变了该数据源,希望另一个组件响应该变化时,localstorage 无 法做到,原因就是区别 1。

29. Redux 和 Vuex 有什么区别,它们的共同思想

(1)Redux 和 Vuex 区别

Vuex 改进了 Redux 中的 Action 和 Reducer 函数,以 mutations 变化 函数取代 Reducer,无需 switch,只需在对应的 mutation 函数里改 变 state 值即可

Vuex 由于 Vue 自动重新渲染的特性,无需订阅重新渲染函数,只要 生成新的 State 即可

Vuex 数据流的顺序是∶View 调用 store.commit 提交对应的请求到 Store 中对应的 mutation 函数->store 改变(vue 检测到数据变化自 动渲染)

通俗点理解就是,vuex 弱化 dispatch,通过 commit 进行 store 状 态的一次更变;取消了 action 概念,不必传入特定的 action 形式进 行指定变更;弱化 reducer,基于 commit 参数直接对数据进行转变,使得框架更加简易;

(2)共同思想

单—的数据源

变化可以预测

本质上:redux 与 vuex 都是对 mvvm 思想的服务,将数据从视图中抽 离的一种方案;

形式上:vuex 借鉴了 redux,将 store 作为全局的数据中心,进行 mode 管理;

30. 为什么要用 Vuex 或者 Redux

由于传参的方法对于多层嵌套的组件将会非常繁琐,并且对于兄弟组 件间的状态传递无能为力。我们经常会采用父子组件直接引用或者通 过事件来变更和同步状态的多份拷贝。以上的这些模式非常脆弱,通 常会导致代码无法维护。

所以需要把组件的共享状态抽取出来,以一个全局单例模式管理。在 这种模式下,组件树构成了一个巨大的"视图",不管在树的哪个位置,任何组件都能获取状态或者触发行为。

另外,通过定义和隔离状态管理中的各种概念并强制遵守一定的规则,代码将会变得更结构化且易维护。

你可能感兴趣的:(前端开发,前端,面试,vue.js,职场和发展,javascript,前端框架,vue)