JavaScript Turbo - A collection of JavaScript Clips

Install

2558 Installs

Readme

JavaScript Turbo 🔥 A collection of Javascript clips for Nova. If you would like to make any suggestions, updates or changes please submit a Pull request via the GitHub Repo. If you find these clips useful consider planting a tree for the world. 🌳 One Tree Planted\ Happy Coding Dan 👨🏻‍💻

JavaScript Turbo is based on: Atom Turbo JavaScript

Details

Declarations

`v⇥` var statement

var ${1:name}

`v=⇥` var assignment

var ${1:name} = ${2:value}

`l⇥` let statement

let ${1:name}

`l=⇥` let assignment

let ${1:name} = ${2:value}

`co⇥` const statement

const ${1:name}

`co=⇥` const assignment

const ${1:name} = ${2:value}

Flow Control

`if⇥` if statement

if (${1:condition}) {
  ${0}
}

`el⇥` else statement

else {
  ${0}
}

`ife⇥` else statement

if (${1:condition}) {
  ${0}
} else {

}

`ei⇥` else if statement

else if (${1:condition}) {
  ${0}
}

`fl⇥` for loop

for (let ${1:i} = 0, ${2:len} = ${3:iterable}.length; ${1:i} < ${2:len}; ${1:i}++) {
  ${0}
}

`fi⇥` for in loop

for (let ${1:key} in ${2:source}) {
  if (${2:source}.hasOwnProperty(${1:key})) {
    ${0}
  }
}

`fo⇥` for of loop

for (let ${1:key} of ${2:source}) {
  ${0}
}

`wl⇥` while loop

while (${1:condition}) {
  ${0}
}

`tc⇥` try/catch

try {
 ${0}
} catch (${1:err}) {

}

`tf⇥` try/finally

try {
 ${0}
} finally {

}

`tcf⇥` try/catch/finally

try {
  ${0}
} catch (${1:err}) {

} finally {

}

`sw⇥` switch case

switch (${1:expr}) {
  case ${2:value}:
    return $0;
  default:
    return;
}

Functions

`f⇥` anonymous function

function (${1:arguments}) {${0}}

`fn⇥` named function

function ${1:name}(${2:arguments}) {
  ${0}
}

`iife⇥` immediately-invoked function expression (IIFE)

(function (${1:arguments}) {
  ${0}
})(${2});

`fa⇥` function apply

${1:fn}.apply(${2:this}, ${3:arguments})

`fc⇥` function call

${1:fn}.call(${2:this}, ${3:arguments})

`fb⇥` function bind

${1:fn}.bind(${2:this}, ${3:arguments})

`af⇥` arrow function

(${1:arguments}) => ${2:statement}

`afb⇥` arrow function with body

(${1:arguments}) => {
\t${0}
}

`gf⇥` generator function

function* (${1:arguments}) {
  ${0}
}

`gfn⇥` named generator function

function* ${1:name}(${1:arguments}) {
  ${0}
}

Iterables

`seq⇥` sequence of 0..n

[...Array(${1:length}).keys()]${0}

`fe⇥` forEach loop

${1:iterable}.forEach((${2:item}) => {
  ${0}
});

`map⇥` map function

${1:iterable}.map((${2:item}) => {
  ${0}
});

`reduce⇥` reduce function

${1:iterable}.reduce((${2:previous}, ${3:current}) => {
  ${0}
}${4:, initial});

`filter⇥` filter function

${1:iterable}.filter((${2:item}) => {
  ${0}
});

`find⇥` find function

${1:iterable}.find((${2:item}) => {
  ${0}
});

Objects and classes

`c⇥` class

class ${1:name} {
  constructor(${2:arguments}) {
    ${0}
  }
}

`cex⇥` child class

class ${1:name} extends ${2:base} {
  constructor(${2:arguments}) {
    super(${2:arguments});
    ${0}
  }
}

`ctor` class constructor

constructor(${1:arguments}) {
  super(${1:arguments});${0}
}

`:⇥` key/value pair

Javascript:

${1:key}: ${2:'value'}

JSON:

"${1:key}": ${2:"value"}

`m⇥` method

${1:method}(${2:arguments}) {
  ${0}
}

`get⇥` getter

get ${1:property}() {
  ${0}
}

`set⇥` setter

set ${1:property}(${2:value}) {
  ${0}
}

`gs⇥` getter and setter

get ${1:property}() {
  ${0}
}
set ${1:property}(${2:value}) {

}

`proto⇥` prototype method

${1:Class}.prototype.${2:methodName} = function (${3:arguments}) {
  ${0}
};

`a⇥` Object assign

Object.assign(${1:dest}, ${2:source})

`ac⇥` Object assign copy (shallow clone)

Object.assign({}, ${1:original}, ${2:source})

Returning values

`r⇥` return

return ${0};

`rth⇥` return this

return this;

`rn⇥` return null

return null;

`rt⇥` return true

return true;

`rf⇥` return false

return false;

`r0⇥` return 0

return 0;

`r-1⇥` return -1

return -1;

`rp⇥` return Promise

return new Promise((resolve, reject) => {
  ${0}
});

`rc⇥` return complex value (such as JSX components)

return (
  ${0}
);

Promises

`p⇥` new Promise

new Promise((resolve, reject) => {
  ${0}
})

`then⇥` Promise.then

${1:promise}.then(${2:value} => {
  ${0}
});

`catch⇥` Promise.catch

${1:promise}.catch(${2:err} => {
  ${0}
});

ES6 modules

`ex⇥` module export

export ${1:member};

`exd⇥` module default export

export default ${1:member};

`im⇥` module import

import ${1:*} from '${2:module}';

`ima⇥` module import as

import ${1:*} as ${2:name} from '${3:module}';

BDD testing (Mocha, Jasmine, etc.)

`desc⇥` describe

describe('${1:description}', function () {
  ${0}
});

`cont⇥` context

context('${1:description}', function () {
  ${0}
});

`it⇥` and `its⇥` synchronous "it"

it('${1:description}', function () {
  ${0}
});

`ita⇥` asynchronous "it"

it('${1:description}', function (done) {
  ${0}
});

`bf⇥` before test suite

before(function () {
  ${0}
});

`bfe⇥` before each test

beforeEach(function () {
  ${0}
});

`aft⇥` after test suite

after(function () {
  ${0}
});

`afe⇥` after each test

afterEach(function () {
  ${0}
});

Console

`cl⇥` console.log

console.log(${0});

`ce⇥` console.error

console.error(${0});

`cw⇥` console.warn

console.warn(${0});

Timers

`st⇥` setTimeout

setTimeout(() => {
  ${0}
}, ${1:delay});

`si⇥` setInterval

setInterval(() => {
  ${0}
}, ${1:delay});

`sim⇥` setImmediate

setImmediate(() => {
  ${0}
});

DOM specifics

`ae⇥` addEventListener

${1:document}.addEventListener('${2:event}', ${3:ev} => {
  ${0}
});

`gi⇥` getElementById

${1:document}.getElementById('${2:id}')

`gc⇥` getElementsByClassName

${1:document}.getElementsByClassName('${2:class}')

`gt⇥` getElementsByTagName

${1:document}.getElementsByTagName('${2:tag}')

`qs⇥` querySelector

${1:document}.querySelector('${2:selector}')

`qsa⇥` querySelectorAll

${1:document}.querySelectorAll('${2:selector}')

`ne⇥` new element

const $0 =  document.createElement('${1:tag}');
$0.className= '${3:class name}';
$0.id = 'hello1';
$0.setAttribute('${4:attribute}', '${5:value});
var textNode = document.createTextNode('${6:text}');
$0.appendChild(textNode);

Node.js specifics

`cb⇥` Node.js style callback

function (err${1:, value}) {${0}}

`re⇥` require a module

require("${1:module}");

`em⇥` export member

exports.${1:name} = ${2:value};

`me⇥` module.exports

module.exports = ${1:name};

`on⇥` attach an event handler

${1:emitter}.on('${2:event}', (${3:arguments}) => {
  ${0}
});

`xm⇥` Express middleware

function (req, res${1:, next}) {
  ${0}
}

`xerr⇥` Express error handler

function (err, req, res, next) {
  ${0}
}

`xer⇥` Express route

${1:express/router}.${2:request}('/', async(req, res, next) => {
  res.send();
});

`xes⇥` Express Server

const express = require("express");
const app = express();
const helmet = require("helmet");
const bodyParser = require("body-parser");

app.get("/", (req, res, next) => {
  return res.send("Hello, I am a Web Server");
});

const port = process.env.PORT || 3000;
app.listen(port, () => console.log(`Listening on port ${port}...`));

Miscellaneous

`us⇥` use strict

"use strict";

License

The MIT License (MIT)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Changelog

Version 1.0.0

Initial release

Version 1.0.2

Minor bug fixes

Version 1.0.4

New Icon Design & bug fixes

Version 1.0.7

Clips updated, new element clip added, new express server clip & new express route clip

Version 1.0.8

Removed ;

License

MIT License

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

Readme

Details

Declarations

v⇥ var statement

v=⇥ var assignment

l⇥ let statement

l=⇥ let assignment

co⇥ const statement

co=⇥ const assignment

Flow Control

if⇥ if statement

el⇥ else statement

ife⇥ else statement

ei⇥ else if statement

fl⇥ for loop

fi⇥ for in loop

fo⇥ for of loop

wl⇥ while loop

tc⇥ try/catch

tf⇥ try/finally

tcf⇥ try/catch/finally

sw⇥ switch case

Functions

f⇥ anonymous function

fn⇥ named function

iife⇥ immediately-invoked function expression (IIFE)

fa⇥ function apply

fc⇥ function call

fb⇥ function bind

af⇥ arrow function

afb⇥ arrow function with body

gf⇥ generator function

gfn⇥ named generator function

Iterables

seq⇥ sequence of 0..n

fe⇥ forEach loop

map⇥ map function

reduce⇥ reduce function

filter⇥ filter function

find⇥ find function