Science Knowings: JavaScript Course For Social Media

Scope (Global vs Local)

Scope (Global vs Local)

In JavaScript, scope defines the accessibility of variables, functions, and objects within a program.

It determines where we can access and use identifiers like variables, functions, or objects.

What is Scope?

Scope refers to the part of a program where an identifier (variable, function, or object) is accessible.

There are two main types of scope in JavaScript: global scope and local scope.

Lexical Scope vs Dynamic Scope

Lexical Scope: The scope of an identifier is determined by its physical location in the code, regardless of how the code is executed.

Dynamic Scope: The scope of an identifier is determined by the runtime environment at the time of execution.

Global Scope vs Local Scope

Global Scope: Variables, functions, or objects declared outside of any function are in the global scope.

Local Scope: Variables, functions, or objects declared within a function are in the local scope.

Block Scope (ES6)

ES6 introduced block scope, which allows us to declare variables within blocks using let and const.

Variables declared with let and const are only accessible within the block they are declared in.

Function Scope

Variables, functions, and objects declared within a function are only accessible within that function.

Closures

Closures are functions that have access to the variables of the outer scope, even after the outer scope has finished executing.

Hoisting

Hoisting is a JavaScript mechanism that moves all declarations (variable, function, class) to the top of their current scope.

This means that variables and functions can be accessed before they are declared.

Variable Shadowing

Variable shadowing occurs when a variable declared in a local scope has the same name as a variable in the global scope or an outer scope.

The local variable takes precedence over the outer variable within the local scope.

IIFE (Immediately Invoked Function Expression)

An IIFE is a function that is executed immediately after it is defined.

This technique can be used to create private variables and avoid polluting the global scope.

Module Pattern

The Module pattern is a design pattern that allows us to create encapsulated modules in JavaScript.

It involves creating a function that returns an object with public and private methods and variables.

Namespace in JavaScript

A namespace is an object that contains related variables and functions under a single name.

It helps organize and avoid conflicts between different parts of the code.

Revealing Module Pattern

The Revealing Module Pattern is a variation of the Module pattern that exposes only a subset of the module's functionality as public.

It provides a way to hide implementation details while still making necessary functionality available.

Singleton Pattern

The Singleton pattern ensures that only one instance of a class or object is created and provides a global point of access to it.

It is useful when we need to maintain a single shared resource or configuration.

Proxy Pattern

The Proxy pattern provides an interface to another object, controlling access to it and potentially modifying its behavior.

It can be used for security, caching, logging, or other purposes.

Next Topic: Arrow Functions

Arrow functions are a concise syntax for writing JavaScript functions.

They are often used as callbacks or in situations where a concise function definition is needed.

Follow us to learn more!