ctrl+shift+p filters: :st2 :st3 :win :osx :linux
浏览

标准代码片段

由 vkhitev 全部

Sublime Text 的 JavaScript 标准风格代码片段

标签 代码片段, 完成, JavaScript

详细信息

  • 0.3.1
  • github.com
  • github.com
  • 8年前
  • 3分钟前
  • 8年前

安装次数

  • 总计 1K
  • Win 738
  • Mac 454
  • Linux 265
8月6日 8月5日 8月4日 8月3日 8月2日 8月1日 7月31日 7月30日 7月29日 7月28日 7月27日 7月26日 7月25日 7月24日 7月23日 7月22日 7月21日 7月20日 7月19日 7月18日 7月17日 7月16日 7月15日 7月14日 7月13日 7月12日 7月11日 7月10日 7月9日 7月8日 7月7日 7月6日 7月5日 7月4日 7月3日 7月2日 7月1日 6月30日 6月29日 6月28日 6月27日 6月26日 6月25日 6月24日 6月23日
Windows 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
Mac 1 1 0 0 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
Linux 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0

README

源代码
raw.githubusercontent.com

Sublime Text 的标准 JavaScript 代码片段

一组适用于在 Sublime Text 中进行 JavaScript 开发的 standardjs 代码风格 代码片段。

js-standard-style

是的，不需要分号： - JavaScript 中的分号是否必要？ - 致 JavaScript 领导者的公开信：关于分号 - JavaScript 分号插入 - 所需的一切

安装

通过 Packge Control 安装

  1. 打开 Package Control (Ctrl+Shift+P)。
  2. 输入并按 '安装包'。
  3. 找到并安装 'StandardSnippets'。

手动安装

  1. 首选项 - 查看包。
  2. 将此存储库的内容添加到任何地方。

禁用默认代码片段

有了这个漂亮的包，您不需要它们！
  1. 通过 Package Control 安装 PackageResourceViewer (Ctrl+Shift+P - 安装包 - PackageResourceViewer)。
  2. 提取 JavaScript 包 (Ctrl+Shift+P - 提取 - JavaScript)。
  3. 打开包文件夹 (首选项 - 查看包)。
  4. 删除 JavaScript/Snippets 并将 JavaScript 文件夹重命名为其他名称（例如 JavaScript-custom）。
  5. 将 JavaScript 添加到忽略的包中 (Ctrl+Shift+P - 禁用包 - JavaScript)。

内容

声明

l⇥ let 赋值

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

co⇥ const 赋值

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

yi⇥ const 赋值

yield ${1:value}

流程控制

if⇥ if 语句

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

el⇥ else 语句

else {
  ${0}
}

ife⇥ else语句

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

}

ei⇥ else if语句

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

for⇥ for循环

for (let ${1:i} = ${2:start}; ${1:i} < ${3:end}; ${1:i} += 1) {
  ${0}
}

rfor⇥ 反向for循环

for (let ${1:i} = ${2:start}; ${1:i} >= ${3:end}; ${1:i} -= 1) {
  ${0}
}

fi⇥ for in循环

for (const ${1:key} in ${2:collection}) {
  ${0}
}

fo⇥ for of循环

for (const ${1:value} of ${2:collection}) {
  ${0}
}
}

wl⇥ while循环

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 {

}

函数

fun⇥匿名函数

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

fn⇥命名函数

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

fas⇥函数赋值

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

iife⇥立即调用的函数表达式(IIFE)

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

af⇥箭头函数

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

afb⇥带主体的箭头函数

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

gfun⇥生成器函数

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

gfn⇥命名生成器函数

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

gfn⇥生成器赋值

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

可迭代对象

fe⇥ forEach循环

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

map⇥ map函数

map((${2:item}) => {
  ${0}
})

reduce⇥ reduce函数

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

filter⇥ filter函数

filter((${2:item}) => {
  ${0}
})

find⇥ ES6 find函数

find((${2:item}) => {
  ${0}
})

every⇥ every函数

every((${2:item}) => {
  ${0}
})

some⇥ some函数

some((${2:item}) => {
  ${0}
})

对象和类

cs⇥类(ES6)

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

csx⇥子类(ES6)

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

kv⇥键值对

Javascript

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

JSON

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

m⇥方法(ES6语法)

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

proto⇥原形方法(可链式调用的)

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

ok Object.keys

Object.keys(${1:obj})

oa Object.assign

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

hop⇥ has own property

Object.prototype.hasOwnProperty.call(${1:object}, ${2:key})

返回值

ret⇥ return

return ${0}

rp⇥ return Promise (ES6)

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

类型

S⇥ String

N⇥ Number

O⇥ Object

A⇥ Array

D⇥ Date

Rx⇥ RegExp

tof⇥ typeof比较

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

iof⇥ instanceof比较

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

ia⇥ isArray

Array.isArray(${1:source})

Promise

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 模块

exp⇥ 模块导出

export ${1:member}

exd⇥ 模块默认导出

export default ${1:member}

imp⇥ 模块导入

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

ima⇥ 模块导入（as）

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

imd⇥ 模块导入拆分

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

BDD测试（Mocha、Jasmine等）

desc⇥ describe

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

its⇥ 同步的“it”

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

ita⇥ 异步的“it”

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

bf⇥ 在测试套件之前

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

bfe⇥ 在每个测试之前

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

aft⇥ 在测试套件之后

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

afe⇥ 在每个测试之后

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

定时器

st⇥ setTimeout

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

si⇥ setInterval

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

sim⇥ setImmediate

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

DOM

ae⇥ addEventListener

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

rel⇥ removeEventListener

${1:document}.removeEventListener('${2:event}', ${3:listener})

gi⇥ getElementById

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

gc⇥ getElementsByClassName

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

gt⇥ getElementsByTagName

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

qs⇥ querySelector

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

qsa⇥ querySelectorAll

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

cdf⇥ createDocumentFragment

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

cel⇥ createElement

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

ac⇥ appendChild

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

rc⇥ removeChild

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

cla⇥ 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}');

ga⇥ getAttribute

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

sa⇥ setAttribute

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

ra⇥ removeAttribute

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

Node.js

cb⇥ Node.js回调

(err, ${1:arguments}) => {
  if (err) {
    throw err
  }
  ${0}
}

req⇥ require一个模块

require('${1:module}')

cre⇥ require并分配一个模块

const ${1:module} = require('${2:module}')

em⇥ 导出成员

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

me⇥ module.exports

module.exports = ${1:name}

on⇥ 添加事件处理器

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

xm⇥ Express中间件

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

xerr⇥ Express错误处理器

(err, req, res, next) => {
  ${0}
}

杂项

us⇥ use strict

'use strict'

js⇥ JSON Stringify

JSON.stringify($0)

jp⇥ JSON Parse

JSON.parse($0)

car⇥ 拷贝数组

const ${1:copy} = [...${2:original}${3:, new}]

cas⇥ 拷贝赋值

const ${1:copy} = { ...${2:original}${3:, new} }

swap⇥ 交换值

[${1}, ${2}] = [${2}, ${1}]

控制台

cl⇥ console.log

console.log(${0})

ce⇥ console.error

console.error(${0})

cw⇥ console.warn

console.warn(${0})

cd⇥ console.dir

console.dir(${0})

贡献

乐于接受包括反馈、错误报告甚至更好的pull request在内的外部贡献。请阅读贡献指南

相关存储库

Standard样式替代方案

  • Semistandard - 标准化，带有分号的代码风格
  • XO - Sindre Sorhus 编写的 JavaScript 代码幸福感风格

许可证

MIT 许可证（MIT）

版权所有 © 2017，Vlad Khitev

任何获得本软件及其相关文档副本（以下简称“软件”）的个人，在此免费获得在不限制条件下使用软件的权利，包括但不限于使用、复制、修改、合并、发布、分发、许可和/或销售软件副本，以及允许向该软件提供软件的个人如此行事，但须遵守以下条件

上述版权声明和本许可声明应包含在软件的所有副本或大部分副本中。

软件按“原样”提供，不提供任何形式的明示或暗示担保，包括但不限于适用于特定目的的适用性和非侵权性担保。在任何情况下，作者或版权所有者不对任何索赔、损害或其他责任负责，无论是因为合同、侵权或其他行为，是否与软件、使用或其他方式使用软件有关。