├── .gitignore
├── .vscode
└── settings.json
├── README.md
├── demo
├── index.html
└── script.js
├── package.json
├── src
└── index.js
└── yarn.lock
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | yarn-error.log
3 | .cache
4 | dist
5 |
--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 | "editor.formatOnSave": true
3 | }
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # square-bracketify
2 |
3 | Aren't regular curved brackets boring? Wouldn't it be fun to spice up your JavaScript?
4 |
5 | Introducing Square-Bracketify, the latest in innovative, lightweight JavaScript libraries.
6 |
7 | Go from this:
8 |
9 | ```js
10 | console.log("Wow, a regular function call.", "How boring.");
11 | ```
12 |
13 | To this:
14 |
15 | ```js
16 | consoleLog[["This is much more exciting!", "I love square brackets!"]];
17 | ```
18 |
19 | ## Usage
20 |
21 | Call `squareBracketify` to transform your boring functions into fun Square Bracket Functions™
22 |
23 | ```js
24 | import squareBracketify from "square-bracketify";
25 |
26 | function sayHello(firstName, lastName, times = 1) {
27 | for (let i = 0; i < times; i += 1) {
28 | console.log(`Hello, ${firstName} ${lastName}!`);
29 | }
30 | }
31 |
32 | // the squareBracketify function comes pre-squared
33 | const sayHelloButWithSquareBrackets = squareBracketify[[sayHello]];
34 |
35 | sayHelloButWithSquareBrackets[["David", "Bailey", 2]];
36 | ```
37 |
38 | Look in `demo/script.js` for more usage examples.
39 |
40 | ## How does it work?
41 |
42 | It (ab)uses the recent Proxy API to treat property access as a function call, along with hijacking `Array.prototype.toString` (which gets called whenever using accessing an property using a non-primitive key) in order to handle function arguments.
43 |
44 | ## Why did you make this?
45 |
46 | I honestly don't know
47 |
--------------------------------------------------------------------------------
/demo/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Square-Bracketify Demo
6 |
7 |
8 | Square-Bracketify Demo
9 | Open your console for some fun!
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/demo/script.js:
--------------------------------------------------------------------------------
1 | import squareBracketify from "../src/index";
2 |
3 | function myBoringRegularFunction(firstName, lastName, times = 1) {
4 | const consoleLog = squareBracketify[[console.log]];
5 | consoleLog[["Arguments:", arguments]];
6 |
7 | for (let i = 0; i < times; i += 1) {
8 | consoleLog[[i + 1, `Hello, ${firstName} ${lastName}!`]];
9 | }
10 | }
11 |
12 | function updateInnerHTML(element, html) {
13 | element.innerHTML = html;
14 | }
15 |
16 | const mySnazzySquareBracketFun = squareBracketify[[myBoringRegularFunction]];
17 | const squareUpdateInnerHTML = squareBracketify[[updateInnerHTML]];
18 | const querySelector = squareBracketify[[document.querySelector, document]];
19 |
20 | mySnazzySquareBracketFun[["David", "Bailey", 2]];
21 |
22 | const el = querySelector[["body h1"]];
23 | const html = "Title updated from JavaScript";
24 | squareUpdateInnerHTML[[el, html]];
25 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "square-bracketify",
3 | "version": "1.0.0",
4 | "main": "src/index.js",
5 | "type": "module",
6 | "scripts": {
7 | "demo": "parcel demo/index.html"
8 | },
9 | "author": "David Bailey ",
10 | "license": "MIT",
11 | "dependencies": {
12 | "parcel-bundler": "^1.12.4"
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | const storedArgs = [];
2 | const origArrayToString = Array.prototype.toString;
3 |
4 | Array.prototype.toString = function() {
5 | storedArgs.push(this);
6 | return origArrayToString.call(this);
7 | };
8 |
9 | function squareBracketify(fn, context = this) {
10 | const handler = {
11 | get() {
12 | const args = storedArgs.pop(); // get last stringified array
13 | storedArgs.length = 0; // clear array
14 | return fn.call(context, ...args); // call original function
15 | }
16 | };
17 |
18 | return new Proxy({}, handler);
19 | }
20 |
21 | const squareBracketifySquared = squareBracketify(squareBracketify);
22 | export default squareBracketifySquared;
23 |
--------------------------------------------------------------------------------