JS Bin

100%

✓ Published0🌍 Public

Last edited Feb 7, 2019

Created on Feb 7, 2019

This example demonstrates a JavaScript function-wrapping utility that intercepts and modifies the behavior of existing functions. The code defines a `wrapper` function, which takes a context object, a function name, and an optional modifier function, then replaces the original function with a proxy that logs arguments or applies custom modifications. Two concrete use cases are shown: wrapping the native `JSON.parse` method to display its arguments in the console, and wrapping a custom `logMsg` function to prepend a prefix to its message. The example uses plain JavaScript (ES5) and relies on the browser console for output.

AI-generated description

Similar vizzes

Loading thumbnail…

JS Bin

This example demonstrates how to wrap an existing method on a JavaScript object to log its arguments while preserving the original behavior. It shows a `User` class with a `trackAction` method that calls a mock `makeAjaxRequest`, and then replaces that method with a wrapper that uses `console.log` to output the function’s arguments and `this` context. The wrapper invokes the original function via `originalFn.apply(this, args)`, ensuring the correct context and return value. The code relies on ES6 classes, arrow functions, and `Array.prototype.slice` to handle arguments.

Aalessioalex

76% match

Loading thumbnail…

JS Bin

This example demonstrates how to intercept and log method calls on a JavaScript object without altering the original function's behavior. It shows a `User` class with a `trackAction` method, which is replaced with a wrapper that logs the arguments to the console while still invoking the original method using `apply` to preserve context. The code relies on ES6 classes, arrow functions, and `Array.prototype.slice` to handle arguments, with output visible in the browser console.

Aalessioalex

72% match

Loading thumbnail…

JS Bin

This example demonstrates how to intercept and log method calls on a JavaScript object while preserving the original function’s behavior. It shows a `User` class with a `trackAction` method that makes an AJAX request, then overrides that method on an instance to print the function’s arguments to the browser console. The code uses ES6 classes, arrow functions, `Array.prototype.slice` to convert arguments, and `Function.prototype.apply` to maintain the correct `this` context. The output appears in the console, illustrating a common debugging or instrumentation pattern.

Aalessioalex

69% match

Loading thumbnail…

Gist d4a6d55663d524237c14

This example demonstrates a JavaScript module that automatically instruments an object’s methods to log their arguments and return values to the browser console. It uses the `underscore` library to chain through the object’s functions, wrapping each method with `console.group` and `console.log` calls. The wrapper takes a module and an identifier, replacing each original method with a logging version that preserves the original behavior. The code shows the pattern for debugging or tracing method calls in a modular JavaScript application.

TThomasG77

63% match

Loading thumbnail…

JS tips

This example demonstrates common JavaScript programming patterns and techniques through concise code snippets. It covers assignment shortcuts, existential checks, JSONP implementation with jQuery’s `getJSON`, a polyfill for `Object.create`, function proxying, reserved words, and the `array.indexOf` method. The code is presented as a gist, showing practical APIs like `Object.create`, `func.apply`, and `Array.indexOf`, with comments explaining each pattern and equivalent syntax in CoffeeScript.

Aabernier

61% 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

61% match

Loading thumbnail…

JS Bin

This example demonstrates JavaScript destructuring and template literal syntax, contrasting a concise ES6+ implementation with its transpiled ES5 equivalent. The page’s source code includes a hand-written JavaScript version using `const` and arrow functions, alongside a generated `'use strict'` script that employs `var` and helper functions like `printName` to achieve the same console output. The data being processed is a simple inline object literal with a name and age property. The visualization is purely textual, relying on the browser’s console to show the logged results of both code paths.

AAlsaxian

60% match

Loading thumbnail…

JS Partials

This example demonstrates partial function application in JavaScript, showing how functions can be pre-bound with arguments to create specialized callable functions. It defines two helper functions, `callFirst` and `callLast`, which use the native `Array.prototype.slice` method to manipulate arguments. The code creates a `greet` function that takes two parameters, then uses these helpers to generate `sayHelloTo` and `beGreetedBy`, which pre-fix either the first or last argument. The output shows two example invocations that produce greeting messages with the bound argument applied in the respective position.

Aapburnes

59% match