Skip to main content
SimilarExport ZIP
100%

JS local scope definition

✓ Published0🌍 Public
RRestuta
Last edited Sep 4, 2014
Created on Sep 4, 2014

This example illustrates the distinction between global and local scope in JavaScript, showing how function declarations behave differently depending on their context. The first script defines a `bla()` function in the global scope, making it accessible via `window.bla()`, while the second script wraps a `foo()` function inside an immediately invoked function expression (IIFE) with `(function() { ... })()`, preventing external access. The code uses the browser's `console.log` to demonstrate execution order and visibility. No external libraries or data sources are involved; the example relies solely on native JavaScript scope rules within a plain HTML document.

AI-generated description

Similar vizzes

Loading thumbnail…

Arrow functions and "this"

This example demonstrates how arrow functions bind `this` to their enclosing lexical scope, unlike regular functions. The JavaScript code defines `Foo` and `Bar`, each with a `setTimeout` callback that logs `this` to the console. A regular function in `Foo` causes `this` to refer to the global `window` object, while the arrow function inside `Bar` preserves the constructor instance, printing `Bar`. The example uses native JavaScript `setTimeout` and `console.log` to illustrate the difference in behavior.

RRestuta
64% match
Loading thumbnail…

JS in HTML

This example demonstrates how JavaScript modules and dependencies are handled within an HTML page, highlighting the contrast between traditional script tags and ES6 module imports. It shows the console output of a string concatenated from variables exported across separate files, including `GetRekt.js` and `lmfao.js`, using named exports. The code uses ES6 `import` and `export` statements, which are bundled by Vizhub’s internal Rollup process when the file is named `index.js`. It visualizes the concept of topological sorting for script dependencies, though the actual rendering is limited to a plain HTML text display.

JJaga-droid
62% match
Loading thumbnail…

JS in HTML

This example demonstrates a minimal HTML page that displays a large, centered "Hello HTML!" message and relies on an external JavaScript file to log a string to the console. The setup uses plain HTML and CSS for structure and styling, while `index.js` imports a constant from `something.js` via ES modules and calls `console.log` to output the combined text. The code highlights the basic integration of JavaScript modules within an HTML document, showing how a static web page can incorporate client-side logic through separate script files.

Pplueckeb@rptu.de
62% match
Loading thumbnail…

JS in HTML

This example demonstrates a minimal HTML page that uses an external JavaScript module to log a message to the browser console. The page structure is defined in `index.html` with a CSS class for a large, centered text element, while the interactive behavior is handled by `index.js`. The script imports a dependency from `something.js` and calls `console.log` to output "Hello JavaScript!". The example serves as a basic starter template for separating markup from script logic, though the displayed message relies on the imported module’s implementation.

Wwspwll@gmail.com
61% match
Loading thumbnail…

Gist 5ef57ecbfb116e6b42706fb6a30b0987

This example demonstrates a common JavaScript scoping pitfall with the `var` keyword, contrasting it with `let`. It shows that declaring multiple variables in a single statement like `var i, r = 0;` only initializes the last variable (`r`), leaving `i` as `undefined`. Consequently, while loops testing `i < 10` never execute, while loops on `r` run ten times, printing "chau". The visualization, presented as a code gist, uses plain JavaScript console output via `console.log` within `while` loops, relying on the browser's or Node.js runtime rather than any external libraries. The gist highlights the importance of explicit initialization for each variable.

MMistyBlunch
61% match
Loading thumbnail…

Js-Bootcamp Livecode - February 5th 2020

This example demonstrates JavaScript object and array mutability, scope, and hoisting concepts through live code examples. It uses native JavaScript objects, arrays, and console logging to illustrate dot and bracket notation for property access, alongside `Object.entries()` for iteration. The code shows global versus function scope with `var`, `let`, and `const`, and explains hoisting by logging a variable before its declaration. The accompanying `index.html` loads a `bundle.js` for execution.

LLaurens
60% match
Loading thumbnail…

JS in HTML

This example demonstrates the integration of JavaScript within an HTML page, displaying the static text “Hello HTML!” styled with CSS. The code imports `something` from `./something.js`, which itself combines a string with the export from `./beautiful.js`, logging the concatenated result to the console. It also references the global `d3` object, though the D3 library is not loaded in the page due to the commented-out script tag. The example illustrates module-based code organization and console output without any interactive visualization.

GGullyPlook
60% match
Loading thumbnail…

JS Bin

This example demonstrates JavaScript destructuring of objects through a side-by-side comparison of original source code and the compiled output. The `index.html` file contains two script blocks: the first shows transpiled ES5 code using `var` declarations and manual property access, while the second shows the original ES6 source with `const` and destructuring assignment. The code logs names from objects to the console, illustrating how ES6 destructuring patterns translate into traditional variable assignments. The visualization uses plain HTML and JavaScript with no external libraries.

AAlsaxian
60% match