javascript 符号_理解JavaScript中“ =”符号的直观指南

javascript 符号

by Kevin Kononenko

凯文·科诺年科(Kevin Kononenko)

理解JavaScript中“ =”符号的直观指南 (A Visual Guide to Understanding the “=” Sign in JavaScript)

实际上,对于第一次学习编码的人来说,赋值运算符(或“ =”符号)实际上会产生误导。 (The assignment operator, or “=” sign, is actually very misleading for anyone that is learning to code for the first time.)

You are taught about the concept of the equals sign for your entire life in math class.

在数学课上,您会学到一生的等号概念。

2 x 3 = 6

2 x 3 = 6

x²-4 = 0

x²-4= 0

The things on the left side of the equation are equal in value to the things on the right side of the equation. They could be flipped at any time, and the statement would still be true.

等式左侧的值与等式右侧的值相等。 它们可以随时翻转,但声明仍然正确。

And then JavaScript comes in like the Kool-Aid man and completely destroys this understanding.

然后,JavaScript像Kool-Aid一样出现,并彻底破坏了这种理解。

Oh, and don’t get me started with the concept of variables. In algebra class, we are taught that variables can only be equal to numbers that satisfy the equation. For example,

哦,别让我开始使用变量的概念。 在代数课上,我们被教导变量只能等于满足方程式的数字。 例如,

x²-4x+3 = 0

x²-4x+ 3 = 0

In the equation above, x can only be 1 or 3. But in JavaScript, the concept of a variable is actually quite different than what you learnt in algebra class.

在上面的等式中, x只能是1或3。但是在JavaScript中,变量的概念实际上与您在代数类中学到的完全不同。

This is a huge issue! It means that every time a newbie looks at an “=” sign when they are learning about variables, they need to repeat in their head over and over:

这是一个巨大的问题! 这意味着,每当新手学习变量时,每次查看“ =”符号时,都需要反复反复进行以下操作:

It’s not what you think it means.

这不是您认为的意思。

It’s not what you think it means.

这不是您认为的意思。

It’s not what you think it means.

这不是您认为的意思。

I wanted to create a more memorable way to explain variables than re-teaching what an “=” sign means. By the end of this tutorial, you will understand why the “=” in variable assignment is more like a ramp that loads up a truck.

我想创建一种比重新教“ =”符号更有意义的方式来解释变量。 在本教程结束时,您将理解为什么变量分配中的“ =”更像是装载卡车的坡道

This should create a clear guide about the purpose of variables and how to use them throughout your script.

这应该为变量的目的以及如何在整个脚本中使用它们创建清晰的指南。

变量的名称和值 (The Name and the Value of a Variable)

Variables are containers for carrying values within your script. In some ways, they are the opposite of variables from algebra.

变量是用于在脚本中携带值的容器。 在某些方面,它们与代数变量相反。

  • You can always give them a new value and restart your script. There is no “permanent” equality to satisfy some condition.

    您总是可以给他们一个新值,然后重新启动脚本。 没有满足某些条件的“永久”平等。
  • The left side of the statement has a completely different purpose than the right side of the statement.

    语句的左侧与该语句的右侧具有完全不同的目的。

Here is an example:

这是一个例子:

let days = 7;

This is called declaring the variable. It creates a new truck called days that can drive around your script and deliver its value OR pick up a new value.

这称为声明变量。 它创建了一个名为days的新卡车,可以围绕您的脚本行驶并提供其价值或获取新的价值

  • The let keyword announces that you are creating a new variable. Or, in the analogy we are about to use, creating a new truck.

    let 关键字宣布您正在创建一个新变量。 或者,以此类推,我们将使用它来创建一辆新卡车。

  • The variable needs a unique name, which is days here. This distinguishes this truck from all the other trucks.

    变量需要一个唯一的名称 ,这里是 。 这使这辆卡车与所有其他卡车区分开来。

  • The assignment operator, or “=” sign, loads the value 7, into the truck.

    分配运算符 (或“ =”符号)将 7装入卡车。

It is very hard to break the habit of looking at this like it is math class all over again, so I am going to explain a little more about the different parts of the variable truck.

很难重新习惯像数学课这样的习惯,所以我将对可变卡车的不同部分进行更多的解释。

This is the left side of the variable statement. It is not an equation! We are creating a truck with a specific name that we can use over and over again. Any time we look at the left side of the statement, we are calling in a truck with a specific name.

这是变量语句的左侧。 这不是方程式! 我们正在创建具有特定名称的卡车,我们可以反复使用它。 每当我们查看语句的左侧时,我们都在呼叫带有特定名称的卡车。

The assignment operator is just like the ramp of a truck. It loads up a new value. You can load up a new value pretty much any time with the let keyword.

分配操作员就像卡车的坡道。 它加载了一个新值。 您几乎可以随时使用let 关键字加载新值。

As a programmer, we are continuously creating new variables, loading up values and watching the changes around the script.

作为程序员,我们正在不断创建新变量,加载值并观察脚本周围的变化。

将值重新分配给变量 (Reassigning Values to Variables)

So far, we can create a truck that can drive around the script and deliver its value. But what about changing the value that the truck is carrying around?

到目前为止,我们可以创建一辆可以围绕脚本行驶并实现其价值的卡车。 但是,如何改变卡车随身携带的价值呢?

The let keyword allows us to create mutable variables whose values can be changed. If we used the const keyword, it would mean that the value is immutable and unchangeable.

let 关键字使我们可以创建可变变量,其值可以更改。 如果我们使用const关键字,则意味着该值是不可变的且不可更改。

In JavaScript, unlike math, you can simply assign a new value to the variable. Our days variable currently stands for the 7 days in a week. But what if we wanted it to stand for the 5 weekdays? Here is the code we could use.

在JavaScript中,与数学不同,您可以简单地为变量分配一个新值。 我们的天数变量当前代表一周中的7天。 但是,如果我们希望它能在5个工作日内站立,该怎么办? 这是我们可以使用的代码。

  1. In line 2, we create the days variable with a value of 7.

    在第2行中,我们创建的days变量的值为7。

  2. On line 4, we re-assign the value of the variable. It is now 5.

    在第4行,我们重新分配变量的值。 现在是5。

  3. On line 6, the days truck arrives with the value of 5.

    在第6行,天卡车到达的值为5。

In the GIF above, line 4 puts a new value in the truck that is later used in line 6.

在上面的GIF中,第4行在卡车中添加了一个新值,该值随后在第6行中使用。

Here is what happens in line 6.

这是第6行发生的情况。

The variable days is not “equal” to anything! It merely carries around the value that you assign to it. This is much more control than you have in math class, where you must discover the value of the variable that satisfies the equation. Now, you are in control!

可变的天数不等于任何东西! 它仅包含您为其分配的值。 这比您在数学类中拥有的控制要多得多,在数学类中,您必须发现满足方程式的变量的值。 现在,您已掌控一切!

为什么需要变量? (Why Do You Need Variables?)

Imagine that you are building an App that tells patients when to take their medication. You need to change the number of days per week based on the medication. Here is a quick snippet.

想象一下,您正在构建一个告诉患者何时服药的应用程序。 您需要根据药物更改每周的天数。 这是一个简短的摘要。

  1. In line 2, days gets loaded up with a value of 7.

    在第2行中,天的值是7。
  2. In line 4, the value of 5 gets loaded up instead.

    在第4行中,取值为5。

In lines 4 and 6, you use the value of the days variable. Could you hard code this by simply putting the number 7 in line 4 and the number 5 in line 6? Of course you could!

在第4和第6行中,使用days变量的 。 您能通过简单地在第4行中输入数字7和在第6行中输入数字5来对此进行硬编码吗? 当然可以!

But, as your App grows, you will find that variables are helpful for 2 reasons:

但是,随着您的应用程序的增长,您会发现变量有帮助的原因有两个:

  1. Instantly changing all the appropriate values at once. Let’s say you had three medications that need to be taken for 7 days a week, and three medications that need to be taken for 5 days a week. You don’t want to constantly change the value of days back and forth! You would instead want to use two separate variables. That gives you two separate trucks to drive values around your script.

    立即一次更改所有适当的值。 假设您有三种药物需要每周7天服用,而三种药物则需要每周5天服用。 你不想不断地改变来回! 相反,您想使用两个单独的变量。 这样就可以给您两个单独的卡车来驱动脚本中的值。

  2. Remembering what a value stands for. If you hard code a value, you may look back and say, why the heck is that 7? But, if you create a variable, you will remember that it stands for 7 days of the week so you can quickly change it if needed.

    记住价值的含义。 如果您硬编码一个值,您可能会回头说,为什么那是7? 但是,如果创建一个变量,您会记住它代表一周的7天,因此您可以根据需要快速进行更改。

赋值运算符右侧的变量名 (Variable Names on Right Side of the Assignment Operator)

So far, we have had a pretty hard rule. The name of the variable is on the left side of the assignment operator, while the value is on the right side.

到目前为止,我们有一个非常严格的规则。 变量的名称在赋值运算符的左侧,而值在右侧。

But what if we have a situation like this?

但是,如果我们遇到这种情况怎么办?

In line 4, the variable name is on both sides of the assignment operator! This is yet another reason why it is NOT an equals sign! In fact, the relationship between the two sides of the statement stays the same.

在第4行中,变量名称在赋值运算符的两侧! 这是为什么它不是等号的另一个原因! 实际上,声明两侧的关系保持不变。

In line 4, we load up a new value onto the days variable. Here is what that looks like.

在第4行中,我们将新值加载到days变量中。 看起来像这样。

Notice how we start at the assignment operator and calculate the right side of the statement first? That is because we are assigning a new value to days here. We cannot touch the left side of the statement. Here is what happens next.

请注意,我们如何从赋值运算符开始并首先计算语句的右侧? 那是因为我们在这里为天分配一个新值。 我们无法触及声明的左侧。 接下来会发生什么。

The days truck pulls up twice in this case. The first time is on the right side of the equation to deliver the old value. And the second time is on the left side of the equation to pick up the new value for days.

在这种情况下,天卡车两次起升。 第一次是在等式的右侧,以传递旧值。 第二次是在等式的左侧,以获取几天的新值。

Our new value for the days variable is 9. In our log statement on line 6, the console would log 9.

我们的days变量的新值为 9。在第6行的log语句中,控制台将记录9。

呼吁采取行动 (Call To Action)

Did you enjoy this? Give it a clap so others can discover it as well. And, if you want to get notified when I release future tutorials that use analogies, sign up here:

你喜欢这个吗? 给它鼓掌,以便其他人也可以发现它。 而且,如果您希望在以后发布使用类比的教程时得到通知,请在此处注册:

翻译自: https://www.freecodecamp.org/news/a-visual-guide-to-understanding-the-sign-in-javascript-3de8495ab3f/

javascript 符号

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/394909.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

iOS开发UIScrollView的底层实现

起始 做开发也有一段时间了,经历了第一次完成项目的激动,也经历了天天调用系统的API的枯燥,于是就有了探索底层实现的想法。 关于scrollView的思考 在iOS开发中我们会大量用到scrollView这个控件,我们使用的tableView/collectionv…

oracle查看登录时间黑屏,oracle 11g默认用户名、密码解锁 以及安装后重启黑屏问题.doc...

oracle 11g默认用户名、密码解锁 以及安装后重启黑屏问题.doc还剩3页未读,继续阅读下载文档到电脑,马上远离加班熬夜!亲,喜欢就下载吧,价低环保!内容要点:遇的同学,参考一下解决办法…

第六十二节,html分组元素

html分组元素 学习要点: 1.分组元素总汇 2.分组元素解析 本章主要探讨HTML5中分组元素的用法。所谓分组,就是用来组织相关内容的HTML5元素,清晰有效的进行归类。 一.分组元素总汇 为了页面的排版需要,HTML5提供了几种语…

WebSocket 实战--转

原文地址:http://www.ibm.com/developerworks/cn/java/j-lo-WebSocket/ WebSocket 前世今生 众所周知,Web 应用的交互过程通常是客户端通过浏览器发出一个请求,服务器端接收请求后进行处理并返回结果给客户端,客户端浏览器将信息呈…

python图形化编程更改内部参数_python-参数化-(3)(替换数据)

一.在读取excel文件、其他数据来源会遇到一些无法转换或者特殊标记的字符串等,不能直接使用。这时候需要对数据进行处理,替换为自己需要的数据进行下一步操作,如下: 替换 1.replace() str.replace(old,new[,max]) old -- 将被替换…

css grid布局_如何使用CSS Grid重新创建Medium的文章布局

css grid布局When people think of CSS Grid they normally envision image grid layouts and full web pages. However, CSS Grid is actually a superb technology for laying out articles as well, as it allows you to do things which previously was tricky to achieve.…

2017视频监控行业应用趋势与市场发展分析

安防行业的发展,从传统单一的业务形态到业务多元化与国际化的转变,是社会安全需求变化与视频监控技术双向驱动的结果。在新的行业生态体系下,传统监控技术与新兴技术的融合,跨行业的业务协同,以及以客户为中心的产业形…

oracle 11.2.4联机文档,ORACLE 11G 联机文档partition_extended_name的一个错误

在看11G联机文档的PARTITION EXTENDED NAME限制的时候,测试发现与书上描述不符。Restrictions on Extended Names Currently, the use of partition-extended and subpartition-extended table names has the following restrictions:No remote tables: A partition…

mongodb 安装、启动

MongoDB 之 你得知道MongoDB是个什么鬼 MongoDB - 1 最近有太多的同学向我提起MongoDB,想要学习MongoDB,还不知道MongoDB到底是什么鬼,或者说,知道是数据库,知道是文件型数据库,但是不知道怎么来用 那么好,所谓千呼万唤始出来,现在我就拉给你们看: 一.初识MongoDB 之 什么东西都…

python os path_python os.path模块

os.path.abspath(path) #返回绝对路径 os.path.basename(path) #返回文件名 os.path.commonprefix(list) #返回list(多个路径)中,所有path共有的最长的路径。 os.path.dirname(path) #返回文件路径 os.path.exists(path) #路径存在则返回True,路径损坏返回False os.…

[转载]PSCAD调用MATLAB/SIMULINK之接口元件设计

原文地址:PSCAD调用MATLAB/SIMULINK之接口元件设计作者:luckyhappier1)接口元件 接口元件包括Graphics,Parameters和Script。注意:变量要与DSDYN要一致(PSCAD根据变量名区别变量)。 2)Circuit 定…

css flexbox模型_Flexbox教程:了解如何使用CSS Flexbox编写响应式导航栏

css flexbox模型In this article, I’ll explain how to create a navbar which adapts to various screen sizes using Flexbox along with media queries.在本文中,我将解释如何使用Flexbox和媒体查询来创建适应各种屏幕尺寸的导航栏。 This tutorial can also b…

oracle数字类型ef映射,Entity Framework 学习中级篇5—使EF支持Oracle9i - ♂风车车.Net - 博客园...

从Code MSDN上下载下来的EFOracleProvider不支持Oracle9i.但是,目前我所使用的还是Oracle9i。为此,对EFOracleProvider修改了以下,以便使其支持Oracle9i.下面说说具体修改地方.(红色部分为添加或修改的代码部分)一,修改EFOracleProvider1,修改EFOraclePr…

Oracle 数据库之最:你见过最高的 SQL Version 是多少?

Oracle数据库中执行的SQL,很多时候会因为种种原因产生多个不同的执行版本,一个游标的版本过多很容易引起数据库的性能问题,甚至故障。 有时候一个SQL的版本数量可能多达数万个,以下是我之前在"云和恩墨大讲堂”分享过的一个案…

mybatis传参问题总结

一、 传入单个参数 当传入的是单个参数时&#xff0c;方法中的参数名和sql语句中参数名一致即可 List<User> getUser(int id);<select id"getUser" parameterType"java.lang.Integer" resultType"com.lee.test.pojo.User">select *…

C 怎么读取Cpp文件_opencv从yaml文件中读取矩阵(c++)

PS:由于我是新手&#xff0c;因此记录的比较罗里吧嗦&#xff0c;本文也属于一个没有任何技术的编程积累。在SLAM系统中&#xff0c;经常需要从配置文件中读取参数文件&#xff0c;读取整型&#xff0c;浮点型都是比较常见的操作&#xff0c;在读取矩阵卡了一下&#xff0c;记录…

oracle中的判断大小,sql语句判断大小

如何用sql语句查看某个数据库中的表的大小--读取库中的所有表名select name from sysobjects where xtypeu--读取指定表的所有列名select name from syscolumns where id(select max(id) from sysobjects where xtypeu and name表名)获取数据库表名和字段sqlserver中各个系统表…

超越Android:探索Kotlin的应用领域

by Adam Arold亚当阿罗德(Adam Arold) 超越Android&#xff1a;探索Kotlin的应用领域 (Going beyond Android: exploring Kotlin’s areas of application) If you have written something in Kotlin, chances are that you wrote it for Android. Kotlin, however, has other…

3.SFB标准版前端安装

SFB服务器准备部分&#xff1a;1.修改服务器名称&#xff0c;sfb加入域&#xff0c;用域管理员账户登录2.配置服务器IP地址&#xff0c;DNS3.安装Windows组件Add-WindowsFeature NET-Framework-Core, RSAT-ADDS, Windows-Identity-Foundation, Web-Server, Web-Static-Content,…

向spark standalone集群提交任务

文档链接 #切换到spark安装目录,执行下面一条命令,192.168.0.10是master的ip, examples/src/main/python/pi.py 是python 文件的路径 ./bin/spark-submit --master spark://192.168.0.106:7077 examples/src/main/python/pi.py任务已经执行完毕,耗时10秒 转载于:https://www.c…