JavaScript變數相關問題

来源:http://www.cnblogs.com/Livia-Peng/archive/2017/03/15/js_variable.html
-Advertisement-
Play Games

JavaScript變數包含的兩種不同數據類型的值——基本類型值和引用類型值的區別;ECMAScript和JavaScript的關係。 ...


  本文重在探討JavaScript變數包含的兩種不同數據類型的值——基本類型值和引用類型值的區別。在此外稍微帶過ECMAScript和JavaScript的關係。

  題為JavaScript變數,但更具體的說應該是ECMAScript變數。

  二十世紀九十年代,Netscape公司和微軟公司推出了兩個不同版本的JavaScript,不利於JavaScript的開發和使用,促使歐洲電腦製造商協會(ECMA,European Computer Manufacturers Association)著手處理JavaScript的標準化問題,從而完成了著名的 ECMA-262——定義了一種名為ECMAScript的新腳本語言的標準。

  一個完整的JavaScript實現包括ECMAScript,文檔對象模型(DOM,Document Object Model),以及瀏覽器對象模型(BOM,Browser Object Model)。ECMAScript作為JavaScript的核心以及實現的基礎,是ECMA-262標準規定的在語法、類型、語句、關鍵字、保留字、操作符和對象這幾個方面內容的語言的描述。

  ECMA-262標準規定的ECMAScript變數是鬆散類型的,可以用來保存任何類型的數據,所以不同類型初始化變數的操作可以放在一條語句中執行,如下列代碼是合法的。

1 var message = "hello",  //string
2     age = 20,           //number
3     found = false;   //boolean 

  用 var 操作符定義的變數將成為定義該變數的作用域中的局部變數,退出該作用域後變數會被立即銷毀。例如在函數內定義一個變數,當函數被調用的時候,該變數即被創建,但在函數退出後,該變數將無法再被繼續訪問。

  ECMAScript中有6種數據類型(也只有6中,ECMAScript不支持任何創建自定義類型的機制)。

  其中基本數據類型包括5種——underfinded、null、boolean、number、string,這5種基本數據類型按值訪問,其值屬於文章開頭提到的基本類型值,是簡單的數據段,可以操作保存在變數中的實際的值。

  第6種為複雜數據類型——object,本質上是由一組無序的名-值對組成的,屬於引用類型值,是保存在記憶體中的對象。JavaScript不允許直接操作對象的記憶體空間,在操作對象時實際是在操作對象的引用而不是實際的對象。

  雖然定義變數時不需要規定其為何種數據類型,但基本類型和引用類型的值可以執行的操作還是大相徑庭。

  屬性的添加

  對於引用類型的值,可以為其屬性和方法進行添加、改變和刪除,如下列代碼:  

var obj = new object();  //創建對象並保存在obj中
obj.name = "Marry";      //添加名為name的屬性,賦予字元串值“Marry”
alert(obj.name);         //彈出"Marry"

    如果obj對象不被銷毀或者name屬性不被刪除,這個屬性將一直存在。  

  再看基本類型值:

var name = "Marry";  //創建字元串
name.age = 20;       //添加名為age的屬性,賦予number值20
alert(name.age);     //彈出"underfinded"

  name字元串被添加了一個age屬性,為其賦值20,但下次訪問時這個屬性就不見了。

  這說明只能給引用類型值動態地添加屬性。

  複製變數值

  從變數a變數b複製基本類型的值,會在變數b對象上創建一個新值,將該值複製到給變數a分配的位置上,獨立保存。這兩個變數參與的任何操作都不會互相影響。

  若從變數c變數d複製引用類型的值,同樣會將存儲在變數d對象中的值複製一份放到為變數c分配的空間中,但這個值的副本實際是一個指針,與變數d指向堆記憶體中的同一個對象。兩個變數實際引用同一個對象,改變其中一個變數,將影響另一個變數。

  具體區別見如下例子:

//基本類型值
var num1 = 5;
var num2 = num1;
num2 = num2 + 5;
alert(num1);                   //5
alert(num2);                   //10

//引用類型值
var obj1 = new object();
var obj2 = obj1;
obj1.name = "Marry";
alert(obj2.name);            //"Marry"

 

   函數傳參

  ECMAScript中所有函數的參數都是按值傳遞的,即將函數外部的值複製給函數內部的參數。鑒於基本類型值與引用類型值複製變數的不同,其函數傳參的效果也不同。

  在向參數傳遞基本類型值時,被傳遞的參數被賦給一個局部變數,函數內部參數的變化不影響函數外部的變數;向參數傳遞引用類型值時,會把這個值在記憶體中的地址複製給一個局部變數,因此這個局部變數的變化將會反映在函數的外部。如下列例子:

//傳遞基本類型值
function addnum(num) {
    num += 10;
    return num; 
}
var num1 = 5;
var num2 = addnum(num1);
alert(num1);                  //5,無變化
alert(num2);                  //15

//傳遞引用類型值
function setage(obj) {
    obj.age = 20;
}
var obj1 = new object();
setage(obj1)
alert(obj1.age);            //20

   在局部作用域中修改的對象反映在全局作用域中,很多人會以為這是按引用傳遞。但函數對象確實都是按值傳遞,見下列例子:

function setage(obj) {
    obj.age = 20;
    obj = new object();
    obj.age = 30;
}
var obj1 = new object();
setage(obj1)
alert(obj1.age);           //20

  此例中在函數內部為obj重新定義了一個對象,且為其age屬性重新賦值,但這一變化並未反映在函數外部,說明obj1 並不是按引用傳遞的。實際函數內重新定義的對象為局部對象,在退出函數後就會被立即銷毀。

 

  檢測類型

  基本類型值可以通過typeof檢測,但typeof檢測引用類型時只能返回object。所以為了知道某個值是什麼類型的對象,ECMAScript提供了instandof操作符,語法如下:

result = variable instanceof constructor

  如果變數是引用類型的實例,instanceof操作符就會返回true。

 


  第一篇技術文,原本想放些實例,但想了想還是想還是從基礎的東西開始記錄。

  時間也有些晚了,腦子不是很清楚((⊙o⊙)…),有錯誤和補充之處請多多指教(抱拳)

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • AJAX技術是網頁構建的必備技能之一,本文希望能幫助大家輕鬆的學習這項技術 ...
  • 文本整理了javascript操作DOM的一些常用的api,根據其作用整理成為創建,修改,查詢等多種類型的api,主要用於複習基礎知識,加深對原生js的認識。 基本概念 在講解操作DOM的api之前,首先我們來複習一下一些基本概念,這些概念是掌握api的關鍵,必須理解它們。 Node類型 DOM1級 ...
  • 複習下ajax吧! 1.創建XMLHttpRequest對象 代碼僅供參考,具體功能可以自己擴展。 http://www.cnblogs.com/jiebba/p/6529854.html http://www.cnblogs.com/jiebba 我的博客,來看吧! 如果有錯誤,請留言修改下 哦! ...
  • 1.現在看看對JSONP的封裝 get / post / getJson 在 ajax的基礎上封裝了再次封裝了。 zepto基本差不多完成了, 看了之後,不難發現,zepto也就有幾大模塊: 選擇器 , 一些js原生方法的封裝 , 事件模型模塊 , 再就是 ajax 的封裝 。 代碼僅供參考,具體功 ...
  • background-image繪製多張圖片疊加,示例如下: css3的box-shadow屬性: 讓ie6、7、8都支持border-radius 、box-shadow、text-shadow的方法:用ie-css3.htc 首先下載ie-css3.htc腳本,然後在css中加入: 它的使用方法 ...
  • 獲取URL裡面傳的參數,在Js中不能像後臺一樣使用Request.QueryString來獲取URL裡面參數,下麵介紹兩種方式用來獲取參數 方式一:使用split分隔來獲取,這種方法考試了地址中包含了returnUrl參數的形式,如果地址中本來就包含了另外一個網址,這個時候需要先過濾掉這個網址再去獲 ...
  • 前言 在vue里,組件之間的作用域是獨立的,父組件跟子組件之間的通訊可以通過prop屬性來傳參,但是在兄弟組件之間通訊就比較麻煩了。比如A組件要告訴一件事給B組件,那麼A就要先告訴他們的爸組件,然後爸組件再告訴B。當組件比較多,要互相通訊的事情很多的話,爸組件要管他們那麼多事,很累的。vuex正是為 ...
  • 本文實現了一個簡單的個人漫畫網站,配合之前的漫畫爬蟲使用。享受無處不在的漫畫生活。 github地址:https://github.com/miaoerduo/cartoon-cat-server 歡迎大家star、fork和指教。 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...