理解Javascritp中的"引用"

用戶83 發布于2019-08-21 11:43 / 1614人閱讀

摘要：二邏輯判斷中的引用通常我們會把理解為值相同，把理解為值相同且類型相同。但是這種理解不是完全準確的。只能確保定義的變量的引用地址不會被改變。

Author: bugall
Wechat: bugallF
Email: 769088641@qq.com
Github: https://github.com/bugall

一：函數中的引用傳遞

我們看下下面的代碼的正確輸出是什么

function changeStuff(a, b, c)
{
  a = a * 10;
  b.item = "changed";
  c = {item: "changed"};
}

var num = 10;
var obj1 = {item: "unchanged"};
var obj2 = {item: "unchanged"};

changeStuff(num, obj1, obj2);

console.log(num); // 10
console.log(obj1.item); // changed    
console.log(obj2.item); // unchanged

在javascript中除了基礎類型采用的是值(值類型有哪些)傳遞，而對象采用是引用傳遞。這就好理解為什么a的值沒有被修改。

那為什么obj1的值修改了，但是obj2的值卻沒有被覆蓋？當我們調用changeStuff函數的時候，參數b，c的值分別是obj1，obj2的引用。

當我們去修改的b的值的時候，因為b->obj1的引用關系沒有變，所以實際修改的是obj1的值。但是參數c的情況就不同了，因為我們在函數中對c進行了引用的重新綁定，c = {item: "changed"} 這時候的c中的對象引用已經改變，這里要清楚引用和指針的關系。

二：邏輯判斷中的引用

通常我們會把==理解為值相同，把===理解為值相同且類型相同。

但是這種理解不是完全準確的。0=="" //true，直觀理解上0怎么會等于""空字符串呢？因為在做==邏輯判斷的時候js會把==兩邊的值做類型轉換，然后再比較。

另外在javascript中比較奇葩的就是關于null，我很難理解為什么null支持比較呢？比如在SQL中我們是不能對null值直接比較的，通常都會使用is null or is not null來做判斷。

如果我們把===理解為值相同，且類型相同那么就無法理解[1] === [1] // false的情況，因為[1]值相同，類型也相同。

我們應該怎么理解===

===不會判斷值是否相同，只會判斷===左右兩邊的變量保存的引用地址是否相同，我們一起看下例子

var a = [1,2,3];
var b = [1,2,3];
var c = a;

var ab_eq = (a === b); // false 因為a,b的引用不同，
// 或者理解為a,b引用的對象在堆上不是同一個對象。

var ac_eq = (a === c); // true 因為a保存了一份對象的引用，
// `c=a` c會把a的值copy一份，這是a,c的值(保存對象的引用)相同。 

其實對于一個變量來說，包含了`左值`和`右值` 后面我會整理文章

類似的例子

var a = { x: 1, y: 2 };
var b = { x: 1, y: 2 };
var c = a;

var ab_eq = (a === b); // false type)
var ac_eq = (a === c); // true

var a = { };
var b = { };
var c = a;

var ab_eq = (a === b); // false 
var ac_eq = (a === c); // true

總結===的三種情況

對于整型 (numbers):
a === b // 如果值相同返回true

對于引用類型來說:
a === b // 如果a,b保存的是同一個對象的引用返回true

對字符串來說:
a === b // 左右兩邊的字符相同返回true

var1 == var2 結果圖

三： const中的引用

我們首先看下官方的定義：

constant cannot change through re-assignment
constant cannot be re-declared

簡單翻譯就是：const定義的變量不能被重新定義，不能被重新賦值。
const 只能確保定義的變量的引用地址不會被改變。但是如果引用指向的
是一個對象的話，你是可以對對象里的值進行修改的，因為沒有改變對象
自身的地址。

const x = {};
x = {foo: "bar"}; // error - re-assigning

const y = ["foo"];
const y = ["bar"]; // error - re-declaring

const foo = "bar"; 
foo = "bar2";       // error - can not re-assign
var foo = "bar3";   // error - already declared
function foo() {};  // error - already declared

但是對于值的修改是允許的

const x = {};

x.foo = "bar";

console.log(x); // {foo : "bar"}

const y = [];

y.push("foo");

console.log(y); // ["foo"];

GPU云服務器云服務器 Quote quoted quot python b&quot&quot

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/87036.html

詳細解說JavaScript內存管理和GC算法

　　JavaScript在創建變量（數組、字符串、對象等）是自動進行了分配內存,而且當它沒有被使用的狀態下，會自動的釋放分配的內容；其實這樣基層語言，如C語言，他們提供了內存管理的接口，比如malloc()用于分配所需的內存空間、free()釋放之前所分配的內存空間。　　釋放內存的過程稱為垃圾回收，例如avaScript這類高級語言可以提供了內存自動分配和自動回收，其實這個自動儲存不會占用太多空間...

3403771864 2022-10-13 21:57 評論0 收藏0
關于String.intern()和new StringBuilder(&quot;&quot;).

摘要：對比較返回是因為這個字符串在執之前已經出現過，字符串常量池中已經有它的引用了，不符合首次出現的原則，而計算機軟件這個字符串則是首次出現的，因此返回。在《深入理解Java虛擬機》書中，提到在jdk1.7的版本中用String.intern()返回引用。 public class RuntimeConstantPoolOOM { public static void main(S...

derek_334892 2019-08-15 12:09 評論0 收藏0
&quot;instanceof 的原理是什么&quot;？大聲告訴面試官，我知道！

摘要：一是如何工作的在上是這樣描述的運算符用于測試構造函數的屬性是否出現在對象原型鏈中的任何位置換句話說，如果，那么必須是一個對象，而必須是一個合法的函數。下面我們舉一個例子一步步來說明第一步每一個構造函數都有一個屬性。在 JavaScript 中，我們通常用 typeof 判斷類型，但是在判斷引用類型的值時，常常會遇到一個問題：無論引用的是什么類型的對象，都會返回 object(當然還有...

CompileYouth 2019-08-23 16:56 評論0 收藏0
深入理解JavaScirpt的函數調用和&quot;this&quot;

摘要：簡單的函數調用顯而易見，一直用調用函數將會非常煩人。規范說幾乎總是被傳遞，但不在嚴格模式下時被調用函數應該將其更改為全局對象。實際上，規范有一個和都使用的原語內部稱為。過去很多年里，我看到過太多關于JavaScript函數調用的混淆。尤其是，很多人抱怨函數調用中this的語義令人困惑。在我看來，通過理解核心函數調用原語，然后將其他所有調用函數的方法視為在原語之上的語法糖，如此便可澄清...

bladefury 2019-08-23 10:34 評論0 收藏0
前端面試資源整理（一）

摘要：是上一次加載資源時，服務器返回的，是對該資源的一種唯一標識，只要資源有變化，就會重新生成。同源限制如果非同源以下三種行為將受到限制和無法讀取。Js相關執行環節和作用域執行環節定義了函數或者變量可以訪問的其它數據，決定了他們各自的行為。每個執行環境都有一個與之關聯的變量對象，在環境中定義的所有變量和函數都保存在這個變量中，并且是我們無法訪問。每個函數都有自己的執行環境，當執行流進入一個函數的時...

phoenixsky 2019-08-30 14:11 評論0 收藏0