CTN 03. Hoisting và từ khóa var

Hello! I'm Zu.Doan

Series này mình muốn rèn luyện khả năng suy nghĩ và giải bài tập, qua đó để hiểu rõ hơn các khái niệm của Javascript. Mình tham khảo các bài tập từ link này.

Bài 1

var tip = 100;

(function () {
  console.log("I have $" + husband());

  function wife() {
    return tip * 2;
  }

  function husband() {
    return wife() / 2;
  }

  var tip = 10;
})();

Lời giải:

var tip = 100;

(function () {
  // ở đây các hàm wife & husband cũng như biến tip đã được hoisting
  // do đó tip = undefined
  // => tip * 2 = NaN
  // => wife() / 2 = NaN

  console.log("I have $" + husband()); // => kết quả của console log = I have $NaN

  function wife() { // hàm được hoisting
    return tip * 2;
  }

  function husband() { // hàm được hoisting
    return wife() / 2;
  }

  var tip = 10; // biến tip ở đây sẽ được sử dụng trong phạm vi của IIFE function
  // và biết tip này cũng sẽ được khai báo đè biến tip ở phạm vi global
  // biết tip được hoisting nên sẽ được đưa khai báo lên đầu phạm vi của IIFE function và do là sử dụng var để khai báo nên biến tip sẽ nhận giá trị ban đầu là undefined
})(); // Đây là IIFE function - hiểu đơn giản là hàm thực thi ngay sau khi được khai báo

Kiến thức liên quan:

• Hoisting biến và function
• Biến sử dụng từ khóa var để khai báo thì sẽ được gán giá trị mặc định là undefined khi được hoisting
• Biến sử dụng từ khóa var có thể khai báo lại

Bài 2

var x = 1;

(() => {
  x += 1;
  ++x;
})();
((y) => {
  x += y;
  x = x % y;
})(2);
(() => (x += x))();
(() => (x *= x))();

console.log(x);

Lời giải:

var x = 1;

(() => {
  x += 1; // => x = 2
  ++x; // => x = 3
})();

((y) => {
  x += y; // x = x + 2 = 5
  x = x % y; // x = 5%2 = 1
})(2);

(() => (x += x))(); // x = 2

(() => (x *= x))(); // x = 2 * 2 = 4

console.log(x); // 4

Kiến thức liên quan: