Skip to content

Commands and snippets for faster Javascript and Typescript with the Atom Editor

License

Notifications You must be signed in to change notification settings

extrabacon/atom-turbo-javascript

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

turbo-javascript

A collection of commands and ES6-ready snippets for optimizing Javascript and Typescript development productivity.

Commands

Use the following keymaps to speed up your development. You can quickly terminate lines with semicolons or manipulate blocks of code with ease.

End Line CTRL-;

Terminates the current line with a semicolon.

End Line with a comma CTRL-,

Terminates the current line with a comma (great for object literals).

End New Line CTRL-ENTER

Terminates the current line with a colon or semicolon, followed with a new line. A comma is inserted when the cursor is inside an object literal, otherwise a semicolon is inserted.

Easy Blocks CTRL-B

Creates a statement block { ... } with the selected text placed inside and properly indented. If the selection is already wrapped with a block, the block is removed and its content is unindented.

Snippets

Snippets are optimized to be short and easy to remember. Some snippets are "chainable" and render differently when preceded by a ".".

For example, .fe renders a chain-friendly version of the "forEach" snippet, while fe renders a full code block.

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 (ES6)

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 (ES6)

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

afb⇥ arrow function with body (ES6)

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

gf⇥ generator function (ES6)

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

gfn⇥ named generator function (ES6)

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

Iterables

seq⇥ sequence of 0..n

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

fe⇥ forEach loop (chainable)

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

map⇥ map function (chainable)

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

reduce⇥ reduce function (chainable)

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

filter⇥ filter function (chainable)

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

find⇥ ES6 find function (chainable)

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

Objects and classes

c⇥ class (ES6)

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

cex⇥ child class (ES6)

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

ctor class constructor (ES6)

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

:⇥ key/value pair

Javascript:

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

JSON:

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

m⇥ method (ES6 syntax)

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

get⇥ getter (ES6 syntax)

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

set⇥ setter (ES6 syntax)

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

gs⇥ getter and setter (ES6 syntax)

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

}

proto⇥ prototype method (chainable)

${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 (ES6)

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

rc⇥ return complex value (such as JSX components)

return (
  ${0}
);

Types

S⇥ String

N⇥ Number

O⇥ Object

A⇥ Array

D⇥ Date

Rx⇥ RegExp

tof⇥ typeof comparison

typeof ${1:source} === '${2:undefined}'

iof⇥ instanceof comparison

${1:source} instanceof ${2:Object}

Promises

p⇥ new Promise (ES6)

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

then⇥ Promise.then (chainable)

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

catch⇥ Promise.catch (chainable)

${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

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

Array.from polyfill required for ES5

gt⇥ getElementsByTagName

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

Array.from polyfill required for ES5

qs⇥ querySelector

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

qsa⇥ querySelectorAll

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

Array.from polyfill required for ES5

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 (chainable)

${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}
}

Miscellaneous

us⇥ use strict

'use strict';

License

The MIT License (MIT)

Copyright (c) 2014, Nicolas Mercier

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.

About

Commands and snippets for faster Javascript and Typescript with the Atom Editor

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published