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

x2-4 = 0

x2-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,

哦,別讓我開始使用變量的概念。 在代數課上,我們被教導變量只能等于滿足方程式的數字。 例如,

x2-4x+3 = 0

x2-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.pswp.cn/news/394909.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/394909.shtml
英文地址,請注明出處:http://en.pswp.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…