/vim-javascript-snippets

:wrench: JavaScript & NodeJS Snippets for Vim

MIT LicenseMIT

vim-javascript-snippets

Build Status

A collection of Javascript (with ES2015 and Node.js) snippets for Vim heavily based on the work of awesome people like @zenorocha, @msanders and @honza and powered by vim-snipmate.

Demo

Install

You need vim-snipmate installed. You can then install, using Plug (or any other vim plugin manager you want):

Plug 'grvcoelho/vim-javascript-snippets'

Console

[cd] console.dir

console.dir(${1:obj})

[ce] console.error

console.error(${1:obj})

[ci] console.info

console.info(${1:obj})

[cl] console.log

console.log(${1:obj})

[cw] console.warn

console.warn(${1:obj})

[de] debugger

debugger

DOM

[ae] addEventListener

${1:document}.addEventListener('${2:event}', ${3:function})

[ac] appendChild

${1:document}.appendChild(${2:elem})

[rc] removeChild

${1:document}.removeChild(${2:elem})

[cel] createElement

${1:document}.createElement(${2:elem})

[cdf] createDocumentFragment

${1:document}.createDocumentFragment(${2:elem})

[ca] classList.add

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

[ct] classList.toggle

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

[cr] classList.remove

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

[gi] getElementById

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

[gc] getElementsByClassName

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

[gt] getElementsByTagName

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

[ga] getAttribute

${1:document}.getAttribute('${2:attr}')

[sa] setAttribute

${1:document}.setAttribute('${2:attr}', ${3:value})

[ra] removeAttribute

${1:document}.removeAttribute('${2:attr}')

[ih] innerHTML

${1:document}.innerHTML = '${2:elem}'

[tc] textContent

${1:document}.textContent = '${2:content}'

[qs] querySelector

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

[qsa] querySelectorAll

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

Flow

[if] if

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

[ife] if else

if (${1:condition}) {
	${2}
} else {
	${3}
}

[ifei] if else if

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

[switch] switch

switch (${1:condition}) {
	case ${2:when}:
		${0}
}

[tc] try catch

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

[tf] try finally

try {
	${1}
} finally {
	${0}
}

[tcf] try catch finally

try {
	${1}
} catch (${2:err}) {
	${3}
} finally {
	${0}
}

Function

[fn] function

function ${1:name} (${2}) {
  ${3}
}

[afn] anonymous function

function (${1}) {
  ${2}
}

[fgn] generator

function* ${1:name} (${2}) {
  ${3}
}

[afgn] anonymous generator

function* (${1}) {
  ${2}
}

[afe] arrow function (expression)

(${1}) => ${2}

[afb] arrow function (body)

(${1}) => {
  ${2}
}

Variables

[const] const

const ${1} = ${0}

[let] let

let ${1} = ${0}

JSON

[jp] json parse

JSON.parse(${1:obj})

[js] json stringify

JSON.stringify(${1:obj})

Loop

[for] for

for (let i = 0 i < ${1:length} i++) {
	${0}
}

[forin] for in

for (${1:prop} in ${2:obj}) {
	if ($2.hasOwnProperty($1)) {
		${0}
	}
}

[forof] for of

for (let ${1:elem} of ${2:obj}) {
	${0}
}

[foreach] forEach

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

[while] while

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

Class

[cla] class definition

class ${1} {
		${0}
}

[clex] class definition with extends

class ${1} extends ${2} {
		${0}
}

Module

[imp] import

import ${1:module} from '{2:path}'

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

License

MIT © 2016