乐趣区

关于javascript:const-和-Objectfreeze-的区别

作者:Ashish Lahoti
译者:前端小智
起源:codingnconcepts

点赞再看,养成习惯

本文 GitHub https://github.com/qq44924588… 上曾经收录,更多往期高赞文章的分类,也整顿了很多我的文档,和教程材料。欢送 Star 和欠缺,大家面试能够参照考点温习,心愿咱们一起有点货色。

最近开源了一个 Vue 组件,还不够欠缺,欢送大家来一起欠缺它,也心愿大家能给个 star 反对一下,谢谢各位了。

github 地址:https://github.com/qq44924588…

这篇文章介绍了应用 constObject.freeze()在 JS 中定义常量和配置值一些做法,以及它们之间的区别。

当咱们在 JS 应用程序中定义常量和配置值时。它们应具备以下特点:

  • 跨应用程序可拜访
  • 量的值是不可变的
  • 变量的援用应该是不可变的

接下来,咱们来一个个看下下面三个特色。

应用 let

咱们应用 let 来定义变量。

let APP_NAME = "前端小智 @大迁世界"

function getApplicationName() {
   APP_NAME = "他是谁?"
   return APP_NAME
}

getApplicationName() // "他是谁?"

在下面的示例中,函数 getApplicationName() 更改了 APP_NAME 的值。咱们要如何避免全局变量被更改?

应用 const

咱们能够应用 const 来定义,这样全局变量就不会被更改到?

const  APP_NAME = "前端小智 @大迁世界"

function getApplicationName() {
   APP_NAME = "他是谁?"
   return APP_NAME // 这里会抛出 TypeError 谬误
}

试图更改应用 const 定义的变量的值,会导致此谬误:

“TypeError: Assignment to constant variable.”

const 能避免变量值被更改吗?,看上面操作:

const fruites = ['葡萄', '哈密瓜']
fruites.push('香蕉')

console.log(fruites) //  ["葡萄", "哈密瓜", "香蕉"]
const constants = {APP_NAME: "前端小智 @大迁世界"}
constants.APP_NAME = "他是谁?"
console.log(constants.APP_NAME) // 他是谁?

从下面的两个例子中能够看出,即便应用const,也能够扭转数组或对象的值。

const 不是应用变量的值不可变,而是变量的援用地址来可变。

当初咱们晓得,在数组和对象的状况下,咱们不能扭转援用,但能够扭转值。如何避免数组和对象的值被扭转?

应用 Object.freeze()

这是 Object.freeze() 起作用的中央,Object.freeze 疏忽对象和数组的值更改。

let constants = Object.freeze({APP_NAME: "前端小智 @大迁世界"})
constants.APP_NAME = "他是谁?"
console.log(constants.APP_NAME) // "前端小智 @大迁世界"

能够从示例中看到,如果更改值,它不会抛出任何谬误,也不会影响对象状态。

Object.freeze() 能够避免更改对象的值,但不能阻止援用的更改:

let constants = Object.freeze({APP_NAME: "前端小智 @大迁世界"})
constants = {APP_NAME : "Unknown App"}
console.log(constants.APP_NAME); // "Unknown App"

小结一下:

  1. const不容许扭转对象或数组的援用,但能够扭转其值。
  2. Object.freeze() 疏忽对象或数组的值更改

把它们组合在一起将避免更改对象或数组的援用和值

一起应用 const 和 Object.freeze()

const constants = Object.freeze({APP_NAME : "Coding N Concepts"});

constants.APP_NAME = "Unknown App"; // 这被疏忽

constants = {APP_NAME : "Unknown App"}; // 这将抛出 TypeError

下面的示例表明,将 constObject.freeze()联合应用对于在 JS 中定义常量和配置十分有用。


原文:https://codingnconcepts.com/j…

交换

文章每周继续更新,能够微信搜寻「大迁世界」第一工夫浏览和催更(比博客早一到两篇哟),本文 GitHub https://github.com/qq449245884/xiaozhi 曾经收录,整顿了很多我的文档,欢送 Star 和欠缺,大家面试能够参照考点温习,另外关注公众号,后盾回复 福利,即可看到福利,你懂的。

退出移动版