Untitled

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>

<script id="jsbin-javascript">
const ob1 = {
  a: 1,
  b: 2
};

console.log(ob1);

const ob2 = {
  nested: {
    nestedDeeper: {
      nestedDeepest: {
        num1: ob1.a,
        num2: ob1.b
      }
    }
  }
};

// obj2.nested.nestedDeeper.nestedDeepest got referenced values.
console.log(ob2.nested.nestedDeeper.nestedDeepest);

// We change ob1.a and hope that ob2.nestedDeeper.nestedDeepest.num1 has changes.
ob1.a = 'ob1.a changed';

// ob1 is changed
console.log(ob1);

// obj2.nested.nestedDeeper.nestedDeepest is not changed.
console.log(ob2.nested.nestedDeeper.nestedDeepest);
</script>


<script id="jsbin-source-javascript" type="text/javascript">const ob1 = {
  a: 1,
  b: 2
};

console.log(ob1);

const ob2 = {
  nested: {
    nestedDeeper: {
      nestedDeepest: {
        num1: ob1.a,
        num2: ob1.b
      }
    }
  }
};

// obj2.nested.nestedDeeper.nestedDeepest got referenced values.
console.log(ob2.nested.nestedDeeper.nestedDeepest);

// We change ob1.a and hope that ob2.nestedDeeper.nestedDeepest.num1 has changes.
ob1.a = 'ob1.a changed';

// ob1 is changed
console.log(ob1);

// obj2.nested.nestedDeeper.nestedDeepest is not changed.
console.log(ob2.nested.nestedDeeper.nestedDeepest);</script></body>
</html>