Please enable JavaScript.

Coggle requires JavaScript to display documents.

Javascript, lexical-environment - Coggle Diagram

- - - - các biến được khai báo trong IIFE không bị trùng lặp với các biến trong phạm vi toàn cục,
      - IIFE tạo ra một phạm vi cục bộ cho code bên trong, giữ cho các biến và hàm được giấu đi và không thể truy cập từ bên ngoài,
      - IIFE cho phép thực thi code ngay sau khi được định nghĩa, hữu ích khi bạn muốn khởi tạo và thực thi một loạt các hàm hoặc khối mã ngay lập tức khi mã được tải.
  - - - Mỗi khi một chương trình javascript được thực thi sẽ khởi tạo các exercution context
        
        Ngay khi một “Execution Context” khởi tạo, một “Lexical Environment” cũng đồng thời được khởi tạo.
        
        Lexical enviroment
        
        local memory
        
        parent's lexical enviroment
        
        Một chuỗi các lexical enviroments được xác định trong thời gian biên dịch (lexical scope), cho phép các hàm con truy cập các biến ở các phạm vi bên ngoài của chúng.
- - - - Call Stack
        
        nơi JavaScript thực thi các hàm. theo cơ chế LIFO
        
        Khi một hàm được gọi, nó được đẩy vào Call Stack. Khi hàm hoàn thành, nó được loại bỏ khỏi Call Stack.
      - Web APIs:
        
        Các API này cung cấp bởi trình duyệt (hoặc Node.js), cho phép thực hiện các tác vụ bất đồng bộ như setTimeout, setInterval, HTTP requests, v.v.
        
        Khi một tác vụ bất đồng bộ được gọi, ví dụ như setTimeout, hàm đó sẽ được chuyển đến Web APIs để xử lý, trong khi Call Stack tiếp tục thực thi các lệnh khác.
      - Callback Queue:
        
        Khi một tác vụ bất đồng bộ hoàn thành, callback tương ứng của nó được đẩy vào Callback Queue (hàng đợi callback).
        
        Callback Queue là một hàng đợi các hàm chờ để được thực thi. THỰC thi theo cơ chế FIFO
      - Event Loop
        
        Event Loop giám sát Call Stack và Callback Queue.
        
        Nếu Call Stack trống (không có hàm nào đang thực thi), Event Loop sẽ đẩy callback từ Callback Queue vào Call Stack để thực thi.
  - - - kỹ thuật phát triển web , các ứng dụng web tìm nạp nội dung từ máy chủ bằng việc thực hiện các tác vụ request http bất đồng bộ, sử dụng content trả về từ server để update các phần nội dung của trang web mà không phải reload lại toàn page
      - cải thiện hiệu suất
      - sử dụng trong các ứng dụng SPA
      - A browser built-in XMLHttpRequest object (to request data from a web server)
        JavaScript and HTML DOM (to display or use the data)
  - - - 3 trạng thái
        
        pending
        
        reject
        
        resolve
- - - - trong hàm constructor , this tham chiếu đến đối tượng được khởi tạo từ constructor đó
      - trong môi trường global, this tham chiếu đến đối tượng window
      - trong phương thức của đối tương, this tham chiếu đến đối tượng đó
      - trong strict mode, this là undefined
  - - - Object.keys(obj) – returns an array of keys.
      - Object.values(obj) – returns an array of values.
      - Object.entries(obj) – returns an array of [key, value] pairs.
  - - - một tập hợp các cặp key-value, trong đó bất kỳ giá trị nào (bao gồm cả đối tượng và giá trị nguyên thủy) có thể được sử dụng làm key hoặc value.
    - - một tập hợp các giá trị duy nhất, trong đó mỗi giá trị chỉ xuất hiện một lần (không có giá trị trùng lặp).
    - - Hiệu suất và Tính linh hoạt: Cả Map và Set đều cung cấp cách truy cập và thao tác dữ liệu hiệu quả hơn so với các cấu trúc dữ liệu truyền thống như Object và Array. Map cho phép sử dụng bất kỳ giá trị nào làm key, trong khi Set đảm bảo các giá trị là duy nhất.
    - - Quản lý Dữ liệu
      - Cấu trúc dữ liệu phức tạp:
      - Lọc và tìm kiếm:
- - - - . Khi chương trình chạy đến dòng lệnh nào sẽ chuyển thành mã máy đến đó để máy tính có thể thực thi.
    - - Thay vì chạy trực tiếp thành mã máy, trình biên dịch sẽ phải chuyển đổi ngôn ngữ lập trình thành mã máy rồi chứa kết quả vào ổ đĩa cứng để có thể thực thi ở lần chạy sau.
- - - - explicit coersion
        tường minh
        
        lập trình viên chủ động yêu cầu chuyển đổi kiểu dữ liệu bằng cách sử dụng các hàm chuyển đổi có sẵn của JavaScript.
      - implicit coersion
        ngần định
        
        Chuyển đổi kiểu dữ liệu một cách tự động và ngầm định bởi JavaScript trong quá trình thực hiện các phép toán hoặc các câu lệnh điều kiện.
      - ex: chuỗi + số = chuỗi
        so sánh == dễ coersion
- - - - giá trị mặc định cho các biến chưa được gán giá trị.
      - js tự động gán giá trị undefined cho các biến khi chúng mới được khai báo và chưa được gán giá trị cụ thể
    - - Null có nghĩa là giá trị rỗng hoặc giá trị không tồn tại, nó có thể được sử dụng để gán cho một biến như là một đại diện không có giá trị.
      - typeof object
    - - Falsy
        
        những giá trị khi được chuyển đổi sang Boolean sẽ trả về false
        
        chuỗi rỗng
        
        0
        
        null, undefined
        
        false
        
        NAN
      - Truthy
        
        những giá trị khi được chuyển đổi sang Boolean sẽ trả về true
  - - - user defined object
      - build- in object
        
        maps
        
        sets
        
        arrays
        
        promise ....
  - - - Khi một biến được gán một giá trị nguyên thủy (primitive value), biến đó lưu trữ trực tiếp giá trị đó.
      - khi gán một biến cho một biến khác hoặc truyền nó vào một hàm, sẽ tạo ra một bản sao, và khi thay đổi giá trị của biến mới sẽ không ảnh hưởng đến biến gốc
    - - Khi một biến được gán đối tượng hoặc mảng thì nó sẽ ko lưu trực tiếp giá trị mà sẽ lưu trữ địa chỉ tới ô nhớ
      - Thay đổi đối tượng thông qua một trong hai biến sẽ ảnh hưởng đến biến kia.
- - - - DOM cho phép các lập trình viên truy cập, thay đổi cấu trúc, nội dung và phong cách của tài liệu. Ví dụ: bạn có thể thay đổi nội dung của một thẻ HTML, thêm hoặc xóa các phần tử, thay đổi thuộc tính CSS, v.v.
    - - DOM thường được sử dụng để tạo ra các trang web tương tác động bằng cách sử dụng JavaScript để thao tác với tài liệu HTML.
    - - được biểu diễn dưới dạng cây với các nút (nodes). Các nút này bao gồm các phần tử (elements), văn bản (text), thuộc tính (attributes), và các kiểu nút khác.
  - - - trong ra ngoài
    - - ngoài vào trong
- - - - một lớp (class) có thể kế thừa các thuộc tính và phương thức từ một lớp khác. Điều này cho phép tái sử dụng mã và tạo ra các mối quan hệ giữa các lớp.
    - - đa hình có thể được thực hiện thông qua phương thức ghi đè (method overriding) và giao diện nhất quán giữa các lớp kế thừa.
    - - đóng gói các thuộc tính và phương thức trong 1 đối tượng, giúp bảo vệ dữ liệu khỏi sự truy cập bên ngoài
      - sử dụng hàm tạo (constructor function), es6 class
    - - Abstraction là quá trình ẩn đi các chi tiết cài đặt phức tạp và chỉ hiển thị các phần quan trọng của đối tượng. Điều này giúp giảm độ phức tạp và tăng tính dễ sử dụng.
- - - - hoisting:
      - Có thể tái khai báo và gán lại giá trị.
      - scope: function, global
    - - scope: block
      - hoisting: được hoisting : sẽ trả về reeffecnce error nếu có tình truy cập trước khai báo
      - Khả năng tái khai báo: Không thể tái khai báo trong cùng một phạm vi, nhưng có thể gán lại giá trị.
    - - hoisting: được hoisting : sẽ trả về reeffecnce error nếu có tình truy cập trước khai báo
      - Khả năng tái khai báo và gán lại giá trị: Không thể tái khai báo hoặc gán lại giá trị. Tuy nhiên, nếu const là một đối tượng hoặc mảng, các thuộc tính bên trong có thể được thay đổi.
      - scope: block