-
Notifications
You must be signed in to change notification settings - Fork 0
/
search.xml
35 lines (23 loc) · 38.2 KB
/
search.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title><![CDATA[ESLint用户配置指南]]></title>
<url>%2F2016%2F12%2F30%2Feslint-user-guide%2F</url>
<content type="text"><![CDATA[配置ESLintESLint被设计成是完全可配置的，意味着你可以关闭任何一条规则并且只运行基本的语法验证，或者可以混合搭配成套的规则和自定义规则来使ESLint完美的适用于你的项目。配置ESLint的两种主要方法如下： 配置注释使用JavaScript注释直接嵌入配置信息到文件中。 配置文件使用JavaScript, JSON或者YAML文件来为整个文件夹及其子文件夹指定配置信息。可以以.eslintrc.*文件或者在package.json文件中添加一个eslintConfig字段的形式指定配置信息，ESLint会自动查找并读取这些配置。或者你可以通过命令行指定配置文件。 有几种信息可以被配置： Environments定义script运行于什么环境之下。每种环境明确的携带了的预定义的全局变量集合。 Globalsscript在运行时可以访问的额外的全局变量信息。 Rules定义在错误级别启用哪些规则。 这些选项可以使用精确的控制ESLint如何处理你的代码。 一. 指定Parser OptionsESLint允许你指定你希望支持的JavaScript语言选择。ESLint默认只支持ECMAScript 5语法。你可以使用Parser options覆盖该配置以支持ECMAScript 6，ECMAScript 7 和 JSX语法。 请注意支持JSX语法和支持React是不一样的。 React将不被ESLint识别的特定语义应用于JSX语法。推荐使用eslint-plugin-react如果你正在使用React并且想支持React语义。 Parser options在.eslintrc.*文件中用parserOptions属性设置。可选项有: ecmaVersion - (Default:5) 可设为3,5,6,7来指定你想要使用的ECMAScript版本。 sourceType - (Default:"script") 可设为"script"或"module"(代码处于ECMAScript模块)。 ecmaFeatures - Object类型，表明你想使用哪些额外的语言功能(这些选项默认值都为false)： globalReturn - 在全局作用域允许return语句 impliedStrict - 启用全局验证模式(如果ecmaVersion为5或者更高版本) jsx - 启用JSX experimentalObjectRestSpread - 启用对object rest/spread properties的支持。(注意：这是一个可能在未来作显著改变的试验性功能，不推荐你依赖该功能编写规则，除非你愿意在该功能发生改变时花费时间去维护) 以下是一个.eslintrc.json示例文件:123456789101112{ "parserOptions": { "ecmaVersion": 6, "sourceType": "module", "ecmaFeatures": { "jsx": true } }, "rules": { "semi": 2 }} 二. 指定Parser默认情况下,ESLint使用Espree作为parser。你可以选择在配置文件中指定一个不同的parser，只要它满足以下需求: 必须是局部安装的npm模块。 必须有Esprima-compatible接口(必须导出parse()方法)。 必须生成Esprima-compatible AST 和 token对象。 即便满足以上需求，也不能保证外部的parser可以和ESLint工作正常。并且ESLint不会修复这些外部parsers与ESLint不兼容的bug. 与ESLint兼容的parser: Esprima Babel-ESLint 三. 指定Environmentsenvironment定义了预定义的全局变量。可选的environments有: browser - 浏览器全局变量。 node -Node.js全局变量和Node.js作用域。 commonjs - CommonJS 全局变量和CommonJS作用域（对使用Browserify/WebPack的浏览器端代码使用）。 shared-node-browser - Globals common to both Node and Browser。 es6 - 启用除了modules的所有ECMAScript 6功能。 worker - web workers 全局变量。 amd - 根据amd规范定义require()和define()作为全局变量。 mocha - 增加所有的Mocha测试的全局变量。 jasmine - 增加所有的Jasmine 1.3,2.0版本测试的全局变量。 jest - Jest全局变量。 phantomjs - PhantomJS全局变量。 protractor - Protractor全局变量。 qunit - QUnit全局变量。 jquery - jQuery全局变量。 prototypejs - Prototype.js全局变量。 shelljs - ShellJS全局变量。 meteor - Meteor全局变量。 mongo - MongoDB全局变量。 applescript - AppleScript全局变量。 nashorn - Java 8 Nashorn 全局变量。 serviceworker - Service Worker全局变量。 atomtest - Atom test helper globals. embertest - Ember test helper globals. webextensions - WebExtensions globals. greasemonkey - GreaseMonkey globals. 以上这些environments并不是互斥的，所以你可以一次定义多个。Environments可以在文件，配置文件或者--env命令行标志 。 在JavaScript文件中用注释指定environments: 1/*eslint-env node, mocha */ 在配置文件中指定environments, 用env作为键，指定其值为一个对象，包含不同环境下的配置。 123456{ "env": { "browser": true, "node": true }} 在package.json文件中指定: 12345678910{ "name": "mypackage", "version": "0.0.1", "eslintConfig": { "env": { "browser": true, "node": true } }} 用YAML格式文件指定: 1234--- env: browser: true node: true 如果想使用plugin的environment，一定要在plugins数组中指定plugin名字，并且用无前缀的plugin名字紧跟着’/‘和environment名字： 123456{ "plugins": ["example"], "env": { "example/custom": true }} 在package.json文件中: 12345678910{ "name": "mypackage", "version": "0.0.1", "eslintConfig": { "plugins": ["example"], "env": { "example/custom": true } }} 在YAML中: 12345--- plugins: - example env: example/custom: true 四. 指定Globalsno_undef规则将会在同一文件中未被定义的变量被访问时警告。如果你在某一个文件中使用全局变量，最好把它们定义为全局的，这样ESlint才不会在使用这些变量时警告。可以用文件里的注释或者配置文件中定义全局变量。 用JavaScript文件注释指定全局变量。 1/* global var1, var2 */ 如果你想选择指定这些全局变量不能写入(只读)，可以为每个变量设置false标记。 1/* global var1:false, var2:false */ 在配置文件中定义全局变量，用globals为键的Object表明想指定哪些变量为全局变量。可以将变量名的值设为true或者false来表明变量是否可以被覆写。 123456{ "globals": { "var1": true, "var2": false }} 用YAML格式： 123---globals: var1: true var2: false 五. 配置PluginsESLint支持使用第三方插件。在使用插件之前你必须通过npm安装该插件。在配置文件中配置使用的插件，用plugins键，值为一个包含plugin名字的数组。plugin可以忽略eslint-plugin-前缀。 123456{ "plugins": [ "plugin1", "eslint-plugin-plugin2" ]} 使用YAML格式 1234--- plugins: - plugin1 - eslint-plugin-plugin2 全局安装的ESLint只能使用全局安装的ESLint插件。局部安装的ESLint可以用局部和全局安装的ESLint插件。 六. 配置RulesESLint附带大量的规则。你可以通过配置注释或者配置文件修改你应用到项目中的规则。要改变一个rule设置，必须先设置rule ID等于这些值之一: "off" or "0" - 关闭rule "warn" or "1" - 作为一个警告信息开启rule（exit code不受影响） "error" or "2" - 作为一个错误信息开启rule（触发时exit code 为1) 在文件中用注释配置rule： 12/* eslint eqeqeq: "off", curly: "error"*//* eslint eqeqeq: 0, curly: 2 */ 上面这两个示例指定关闭eqeqeq规则和作为错误信息启用curly规则。只不过第二个示例用数值替代了字符值。 如果一个rule有额外的选项，可以用数组字面量语法指定它们，示例如下: 1/* eslint quotes: ["error", "double"], curly: 2 */ 该注释为”quotes”规则指定了”double”选项。数组的第一项始终是指定规则严重性。在配置文件中配置规则示例: 1234567{ "rules": { "eqeqeq": "off", "curly": "error", "quotes": ["error", "double"] }} 使用YAML格式： 1234567---rules: eqeqeq: off curly: error quotes: - error - double 配置插件内部定义的规则，必须加在rule ID加上plugin名字和’/‘作为前缀： 1234567891011{ "plugins": [ "plugin1" ], "rules": { "eqeqeq": "off", "curly": "error", "quotes": ["error", "double"], "plugin1/rule1": "error" }} 使用YAML格式: 123456789---plugins: - plugin1rules: eqeqeq: 0 curly: error quotes: - error -"double" plugin1/rule1: error 在上面的两个示例中，”plugin1/rule1”规则来自名为”plugin1”的插件。同样也可以在Script文件注释中使用该规则。 1/* eslint "plugin1/rule1": "error"*/ 七. 使用内联注释禁用Rules在文件中临时禁用规则警告信息: 12345/* eslint-disable */// Disables all rules between commentsalert('foo');/* eslint-enable */ 也可以对指定的规则禁用警告信息: 1234567/* eslint-disable no-alert, no-console */// Disables no-alert andno-console warnings between commentsalert('foo');console.log('bar');/* eslint-enable no-alert, no-console 要为整个文件中禁用规则警告信息，将/* eslint-disable */放在文件顶部： 1234/* eslint-disable */// Disables all rules for the rest of the filealert('foo'); 同样也可以为整个文件禁用指定规则: 123/* eslint-disable no-alert */// Disables no-alert for the rest of the filealert('foo'); 为指定行禁用所有规则:1234alert('foo'); // eslint-disable-line// eslint-disable-next-linealert('foo'); 为指定行禁用多个规则:1234alert('foo'); // eslint-disable-lineno-alert, quotes, semi// eslint-disable-next-lineno-alert, quotes, semialert('foo'); 注意:为文件部分代码禁用警告信息的注释是告诉ESLint在这部分代码中不用报告违背规则的警告信息。ESLint会解析整个文件，所以禁用的代码仍然需要遵循JavaScript语法。 八. 添加Shared SettingsESLint支持在配置文件中添加共享设置。可以在ESLint配置文件中添加settings对象并且会应用到每个将要被执行的规则。在你添加自定规则并且想要它们能访问同样的信息并且是可配置的时很有用处。 使用JSON格式:12345{ "settings": { "sharedData": "Hello" }} 使用YAML格式:123--- settings: sharedData:"Hello" 九. 使用配置文件使用配置文件有两种方式。第一种是保存文件到任何想要保存的地方，在使用命令行时使用’-c’参数并传入保存的位置： 1eslint -c myconfig.json myfiletotest.js 第二种方式是通过.eslintrc.*和package.json配置文件。ESLint会自动在被检测文件的目录中查找该配置文件，并且连续查找父文件夹直到文件系统的根目录。当你想要给在一个项目的不同部分使用不同的配置或者想要其他人能直接使用ESLint而不需要记住传入配置文件时，这种方式很有用处。 十. 配置文件格式ESLint支持多种配置文件格式: JavaScript - 使用.eslintrc.js并且导出一个包含配置的Object。 YAML - 使用.eslintrc.yaml或者.eslintrc.yml定义配置结构。 JSON - 使用.eslintrc.json定义配置结构。ESLint的JSON文件允许使用JavaScript风格的注释。 Deprecated - 使用.eslintrc,可以是JSON或者YAML package.json - 在package.json文件中创建eslintConfig属性，并且在该属性值中定义配置。 如果在同一文件夹中有多个配置文件，ESLint只会使用其中一个，优先级顺序为: .eslintrc.js .eslintrc.yaml .eslintrc.yml .eslintrc.json .eslintrc package.json 十一. 配置Cascading和Hierarchy当.eslintrc.*和package.json文件来配置时，可以利用级联配置。例如,假设有以下项目结构: 1234567your-project├── .eslintrc├── lib│ └── source.js└─┬ tests ├── .eslintrc └── test.js 级联配置优先使用最近的.eslintrc文件，然后是父目录的配置文件，以此类推。在该项目中运行ESLint时，所有lib/目录下的文件都会使用项目根路径下的.eslintrc文件作为配置文件。当ESLint遍历到tests/目录，它将使用除了your-project/.eslintrc文件之外的your-project/tests/.eslintrc文件。所以your-project/tests/test.js会基于这两个.eslintrc文件所在目录层次被检测，优先使用最近的配置。用这种方式，可以设置项目级别的ESLint设置并且可以在指定目录下覆盖这些设置。 同样的，如果根目录有一个包含eslintConfig字段的package.json文件，该字段定义的配置会应用到项目下的所有子目录，但是如果tests目录下的.eslintrc文件配置与该字段配置冲突时，会覆写该字段的参数配置。 1234567your-project├── package.json├── lib│ └── source.js└─┬ tests ├── .eslintrc └── test.js 如果在同一目录中既有.eslintrc文件又有package.json文件，.eslintrc文件优先级更高，package.json文件配置不会用到。 注意:如果你在home目录有个人设置(~/.eslintrc),只有在没有其他配置文件被找到使才会被用到。由于个人设置会被应用到所有用户目录，包括第三方代码，所以可能会导致运行ESLint时出现问题。 默认情况下，ESLint会从所有父文件夹查找配置文件直到根目录。这在想要所有项目都遵循某一惯例时很有用，但是有时候也会导致意想不到的结果。要限制ESLint在指定项目中生效，需要放置"root":true到项目根目录下的package.json文件的eslintConfig字段，或者.eslintrc.*文件中。一旦找到了"root":true的设置，ESLint将会停止在父文件夹中查找。 123{ "root": true} 使用YAML格式: 12--- root: true 假设projectA在主要项目目录下的.eslint文件中设置了"root":true。在这种情况下，当检测main.js文件时，lib/目录下的.eslintrc文件会被用到，但是projectA/不会被使用。 示例: 12345678home└── user ├── .eslintrc <- Always skipped if other configs present └── projectA ├── .eslintrc <- Not used └── lib ├── .eslintrc <- { "root": true } └── main.js 完整的配置层叠关系，优先级从高到低，如下所示: 内联配置: /*eslint-disable*/和 /*eslint-enable*/ /*global*/ /*eslint*/ /*eslint-env*/ 命令行参数: --global --rule --env -c, --config 项目级别配置： .eslintrc.*或者package.json在同一目录作为检测配置文件。 继续寻找.eslintrc.*和package.json在祖先目录直到根目录或者直到"root": true配置被找到。 缺少配置时，回退到用户默认配置~/.eslintrc。 十二. 扩展配置文件一个配置文件可以从基本配置中继承一整套启用的规则。这个extends属性值可以是: 指定配置的字符串。 字符串数组：每一个额外的配置都会继承以前的配置。 ESLint递归地继承配置，因此基本配置也有一个extends属性。rules属性可以做以下处理来继承或者重写这一套规则: 启用额外的rules 重写从基本配置中来rules的默认选项 禁用从基本配置中来的rules 十三.使用”eslint:recommended”extends属性值为eslint:recommended启用了报告常见问题的一部分核心rules,这些rules以后再做介绍。推荐的子集仅仅只能在major版本中的ESLint中被修改。 如果你的配置继承了推荐的rules,在你升级到一个major新版本的ESLint后，在命令行中使用--fix之前检查一下报告的问题，这样你就会知道一个新的可解决的推荐规则是否将要更改代码。 eslint --init命令可以创建一个配置，这样可以你可以继承推荐的rules. 一个JavaScript格式的配置文件示例如下: 1234567891011121314151617module.exports = { "extends": "eslint:recommended", "rules": { // enable additional rules "indent": ["error", 4], "linebreak-style": ["error", "unix"], "quotes": ["error", "double"], "semi": ["error", "always"], // override default options for rules from base configurations "comma-dangle": ["error", "always"], "no-cond-assign": ["error", "always"], // disable rules from base configurations "no-console": "off", }} 十四.使用可共享的配置包一个可共享的配置可以是一个导出一个配置对象的npm包。确保安装该包至ESLint可以获取到的目录下。 extends属性可以忽略包名eslint-config-前缀。 eslint --init命令可以创建一个配置，这样你可以继承一个流行的风格指南(例如，eslint-config-standard)。 一个YAML格式的配置文件: 123456extends: standardrules: comma-dangle: - error - always no-empty: warn 十五.使用来自plugin的配置插件通常是一个用来导出规则的npm包。有些插件也导出一个或者多个命名配置。确保安装该包至ESLint可以获取到的目录下。 extends属性可以忽略包名eslint-config-前缀。 extends属性值可以包含: plugin: 包名(可以忽略前缀) / 配置名(例如recommended) 使用JSON格式的配置文件示例: 123456789101112{ "plugins": [ "react" ], "extends": [ "eslint:recommended", "plugin:react/recommended" ], "rules": { "no-set-state": "off" }} 十六.使用配置文件extends属性值可以是一个绝对或者相对路径的基本配置文件。 ESlint相对于配置文件解析了一个相对路径的基本配置文件，并且会使用该配置文件，除非该配置文件在home目录下或者一个不是ESLint安装目录（局部或者全局）的祖先目录。在这些情况下，ESLint相对于被检测的项目目录（通常是当前工作目录）解析相对路径文件。 一个使用JSON格式的配置文件示例: 12345678910{ "extends": [ "./node_modules/coding-standard/eslintDefaults.js", "./node_modules/coding-standard/.eslintrc-es6", "./node_modules/coding-standard/.eslintrc-jsx" ], "rules": { "eqeqeq": "warn" }} 十七.使用”eslint：all”extends属性值可以是"eslint:all",可以启用当前安装ESLint版本中的所有核心规则。这一整套核心规则可以在ESLint的minor或者major版本中被修改。 重要提示:该配置不推荐用于生产环境，因为它可以被每一个minor和major的ESLint版本所修改。在风险可控范围使用。 如果配置在升级ESLint时自动启用新规则，ESLint可以在源代码没改变时报告新问题，因此任何新的minor版本的ESLint可以表现得好像它有破坏的变化。 当你决定为项目搜寻配置的规则和选项时，你可以启用所有核心规则作为快捷方式，尤其是你很少重写选项或者禁用规则的情况下。规则的默认选项不是ESLint推荐的。 如果你的配置继承了所有的rules,在你升级到一个major或者minor新版本的ESLint后，在命令行中使用--fix之前检查一下报告的问题，这样你就会知道一个新的可解决的推荐规则是否将要更改代码。 一个使用JavaScript的配置文件示例: 1234567891011121314151617module.exports = { "extends": "eslint:all", "rules": { // override default options"comma-dangle": ["error", "always"], "indent": ["error", 2], "no-cond-assign": ["error", "always"], // disable now, but enable in the future "one-var": "off", // ["error", "never"] // disable "init-declarations": "off", "no-console": "off", "no-inline-comments": "off", }} 十八. 配置文件中的注释JSON和YAML格式的配置文件都支持注释，package.json文件不应该包含注释。你可以使用JavaScript风格或者YAML风格的注释，ESLint都会安全的忽略它们。这样允许我们的配置文件可以对人更加友好。示例: 12345678910{ "env": { "browser": true }, "rules": { // Override our default settings just for this directory "eqeqeq": "warn", "strict": "off" }} 十九.指定要检测文件的扩展名目前唯一告诉ESLint哪些扩展文件需要被检测方式是，使用–ext命令行选项指定一个逗号分隔的扩展名列表。 二十.忽略文件和目录可以通过在项目根目录创建.eslintignore文件告诉ESLint忽略指定的文件和目录。.eslintignore文件时一个纯文本文件，每一行都是一个glob pattern（通配符模式串），表明哪些路径应该被忽略检测。以下示例会忽略所有的JavaScript文件: 1**/*.js 当ESLint运行时，在决定检测哪些文件之前，它会在当前工作目录寻找一个.eslintignore文件。如果这个文件存在，那么这些偏好设置将会在目录遍历是被应用到。一次只可以使用一个.eslintignore文件，因此除了当前目录下的.eslintignore文件之外，其它的.eslintignore文件不会被使用。 Globs用node-ignore匹配，可用功能有: 以#开头的行被当作是注释并且不会影响忽略模式。 路径都是相对于.eslintignore或者当前工作目录。这也会影响通过--ignore-pattern传入的路径。 忽略模式遵循.gitignore规范。 以!开头的是否定模式，用于将早前忽略的文件重新包含进来。 除了.eslintignore文件指定的模式，ESLint始终会忽略/node_modules/*和bower_components/*下的文件。 例如,放以下的.eslintignore文件到当前工作目录下将会忽略所有的node_modules,bower_components,任何可能被转义的.ts.js或.coffee.js扩展名文件，以及除build/index.js外build目录下的任何文件: 12345# /node_modules/* and /bower_components/* ignored by default# Ignore built files except build/index.jsbuild/*!build/index.js 二十一.使用可选文件(可替代.eslintignore)如果你倾向于在当前目录下使用一个不同的文件，而不是.eslintignore文件，可以通过命令行使用--ignore-path参数来指定它。例如，你可以使用.jshintignore文件，因为它们有同样的格式： 1eslint --ignore-path .jshintignorefile.js 你也可以使用.gitignore文件: 1eslint --ignore-path .gitignorefile.js 任何遵循标准ignore文件格式都可以被使用。记住指定ignore-path意味这任何存在的.eslintignore文件不会被使用。注意.eslintignore中任何通配符规则与.gitignore一样。 二十二.忽略文件警告信息当你传入目录到ESLint,文件和目录都会被默默忽略。如果你传入一个指定文件到ESLint，那么你将会看到一条表明该文件被跳过的警告信息。假设你有一个类似的.eslintignore文件，如下所示: 1foo.js 接着运行: 1eslint foo.js 你将会看到以下警告信息:1234foo.js 0:0 warning File ignored because of your .eslintignore file. Use --no-ignore to override.✖ 1 problem (0 errors, 1 warning) 这条消息出现是因为ESLint不确定你是否真的想要检测该文件。如消息表示，你可以使用--no-ignore来忽略使用ignore规则。]]></content>
</entry>
<entry>
<title><![CDATA[RequireJS 配置]]></title>
<url>%2F2016%2F12%2F30%2FRequireJSDoc%2F</url>
<content type="text"><![CDATA[加载JavaScript文件RequireJS使用了不同于传统<script>标签加载脚本的方法。然后它也可以运行得很快，优化好，主要目的是为了鼓励JavaScript代码模块化。除此之外，它还鼓励使用module IDs取代script标签的URLs路径。 RequierJS相对于baseUrl指定的路径来加载所有代码。data-main属性指定了加载页面的最顶部脚本，baseUrl通常设置为与data-main指定脚本的所在目录相同。require.js会检查data-main属性开始加载脚本。 baseUrl可以在RequireJS config文件中手动配置，如果没有显示配置该属性并且没有使用data-main属性，那么默认的baseUrl是运行RequireJS的HTML页面所在的目录。 RequireJS同样假定默认所有依赖模块都是js脚本，因此不需要在module IDs加”.js”后缀。RequireJS在转换module ID为路径时会自动添加后缀。可以在paths config中指定一组脚本的位置。 很多时候，你想直接引入一个脚本文件，并且不习惯通过”baseUrl+paths”规则找到它。RequireJS也会有相应的处理。如果一个module ID有以下字符，那么这个ID不会通过”baseUrl+paths”配置的方式传入，而是把它当成相对于当前页面所在的URL（与页面中直接指定一样）。 以”.js”结尾 以”/“开头 包含”http:”或者”https” URL协议 data-main 入口点require.js将会检查data-main这个特殊的属性值并开始脚本加载。 通常会使用data-main脚本设置配置选项，然后加载第一个应用程序模块。需要注意:require.js为data-main模块生成的script标签会包含async属性。这意味着你不能假定data-main脚本的加载和执行将会优先在页面后面引用的其他脚本之前完成。 下面的例子中，不能保证require.config中’foo’模块在other.js运行之前加载完成，所以在后面的other.js中通过require()加载foo模块，会尝试加载script/foo.js文件，而不是我们指定的文件。 12<script data-main="scripts/main" src="scripts/require.js"></script><script src="scripts/other.js"></script> 123456// contents of main.js:require.config({ paths: { foo: 'libs/foo-1.1.3' }}); 12345678// contents of other.js:// This code might be called before the require.config() in main.js// has executed. When that happens, require.js will attempt to// load 'scripts/foo.js' instead of 'scripts/libs/foo-1.1.3.js'require(['foo'], function(foo) {}); 如果想要在HTML页面调用require()方法，最好不要使用data-main属性。data-main属性仅供那些只有一个主入口点(data-main脚本)的页面使用。对于想要内联调用require()的页面，最好把该调用包含在require()调用configuration的回调函数中。12345678910<script src="scripts/require.js"></script><script> require(['scripts/config'], function() { // Configuration loaded now, safe to do other require calls // that depend on that config. require(['foo'], function(foo) { }); });</script> 定义一个模块一个模块与传统的脚本文件的不同在于，模块定义了一个封闭的作用域对象避免了污染全局命令空间。它可以显示的列出它所有的依赖，并且能够很好的处理这些依赖而无需引用全局对象，而不是通过接受这些依赖为函数的参数来定义这个模块。RequireJS中的模块是Module Pattern的扩展，好处是不需要通过引入全局对象来引用其他模块。 RequireJS语法可以使模块尽可能地快速加载，即便次序颠倒，它也能估算出正确的依赖顺序，因为没有引入全局变量，所以它可以在一个页面上加载一个模块的多个版本。 简单键/值对如果该模块没有任何依赖，只是一个键值对集合，那么只需要把字面量对象作为参数传入define()函数。 12345//Inside file my/shirt.js:define({ color: "black", size: "unisize"}); 定义函数如果模块没有任何依赖，但是需要使用函数来做一些初始设置，把一个函数作为参数传入给define()函数。123456789//my/shirt.js now does setup work//before returning its module definition.define(function () { //Do setup work here return { color: "black", size: "unisize" }}); 定义有模块依赖的函数如果该模块有依赖，那么define()函数的第一个参数应该是一个包含依赖模块名的数组，第二个参数应该是一个定义函数，一旦所有的依赖模块都加载后，会调用该函数来定义该模块。依赖会作为函数参数传入定义函数，参数顺序与依赖模块数组一致。1234567891011121314//my/shirt.js now has some dependencies, a cart and inventory//module in the same directory as shirt.jsdefine(["./cart", "./inventory"], function(cart, inventory) { //return an object to define the "my/shirt" module. return { color: "blue", size: "large", addToCart: function() { inventory.decrement(this); cart.add(this); } } }); 在上面这个例子中，创建了一个my/shirt模块。它依赖于my/cart和my/inventory。在硬盘上的结构如下： my/cart.js my/inventory.js my/shirt.js 上面的函数调用指定了两个参数，cart和inventory。这对应着"./cart"和"./inventory"模块的模块名。上面的在my/cart和my/inventory模块被加载之后才调用。返回的对象定义了my/shirt模块。通过这种方式定义的模块，不会以全局对象形式存在。 定义函数作为一个模块模块不返回对象。任意合法的函数返回值都是可以的。下面的例子中，返回了一个函数作为模块定义。1234567891011121314151617//A module definition inside foo/title.js. It uses//my/cart and my/inventory modules from before,//but since foo/title.js is in a different directory than//the "my" modules, it uses the "my" in the module dependency//name to find them. The "my" part of the name can be mapped//to any directory, but by default, it is assumed to be a//sibling to the "foo" directory.define(["my/cart", "my/inventory"], function(cart, inventory) { //return a function to define "foo/title". //It gets or sets the window title. return function(title) { return title ? (window.title = title) : inventory.storeName + ' ' + cart.name; } }); 定义一个简化的CommonJS包装模块如果你想重用那些用CommonJS模块格式写的代码，通过重做上面代码中依赖数组模块会很困难，你可能喜欢直接通过依赖名字取到模块作为本地变量来使用依赖模块。在这种情况下，你可以使用简单的CommonJS包装：1234567define(function(require, exports, module) { var a = require('a'), b = require('b'); //Return the module value return function () {}; }); 这个包装器依赖于Function.prototype.toString(),以字符串的形式返回了函数的内容。 定义一个命名模块你也许会碰到有些情况下,调用define()包含一个该模块的名字作为define()函数的第一个参数。1234567//Explicitly defines the "foo/title" module:define("foo/title", ["my/cart", "my/inventory"], function(cart, inventory) { //Define foo/title object in here. }); 你可以显示提供模块名，但是会使模块可移植性低。如果你把该文件移动到其他文件夹，你就需要改变模块名。通常最好避免在代码中指定模块名，optimization tool会自动为模块命名，这样可以通过模块名将多个模块打包到一个文件中，从而在浏览器中更快的加载。 其他模块说明一个模块一个文件：每一个JavaScript文件只定义一个模块，使得模块易于通过name-to-file-path算法来查找，使用optimization tool组织多模块到优化文件中。define()里使用相对模块名:如果在define()调用的回调函数中调用require("./relative/name"),需要先添加require为依赖，以便于正确解析模块的相对路径。 123define(["require", "./relative/name"], function(require) { var mod = require("./relative/name");}); 或者使用转换CommonJS模块的快捷语法更好。 123define(function(require) { var mod = require("./relative/name");}); 这种形式使用Function.prototype.toString()查找函数内部的require()调用，并且将它们与require模块一起添加到依赖数组中。 如果你正在一个目录中创建几个模块时，相对路径是非常有用的，这样你就可以与其他人或者项目共享该目录，并且你可以在不需要知道目录名的情况下，得到模块所在目录的兄弟模块。 相对模块名是相对于其他名字，而不是路径:加载器内部使用模块名字而不是模块路径来存储模块。因此对于相对名字引用，都是解析为相对于模块名的引用，然后在需要加载的时候才把模块名或者ID转换成模块路径。示例代码中，compute包 含有main和extras两个模块： 1234* lib/ * compute/ * main.js * extras.js main.js: 123define(["./extras"], function(extras) { //Uses extras in here.}); 如果有paths配置如下: 123456require.config({ baseUrl: 'lib', paths: { 'compute': 'compute/main' }}); require(['compute'])完成时，lib/compute/main.js会以'compute'为模块名。当请求'./extras.js'时，是相对于'compute'解析的，为'compute/./extras'，规范化为'extras'。因为paths配置中并没有指定该模块,生成的路径将会是'lib\extra.js'，是不对的。 这种情况，package config是一个好的选择。由于它允许将main模块设为'compute',但是在加载器内部，会用'compute/main'这个ID存储该模块，因此'./extras'的相对引用会生效。 另一个选择是在构建一个模块lib/compute.js,不需要paths或者package做配置。 1define(['./compute/main'], function(m) { return m; }); 或者不设置paths或者packages,在最顶部调用require(['compute/main'])。 生成相对于模块的URLs:你也许需要生成一个相对于模块路径的URL。只需要添加"require"模块为依赖，然后调用require.toUrl()来生成URL。 123define(["require"], function(require) { var cssUrl = require.toUrl("./style.css");}); 控制台调试:如果你需要用到已经通过在JavaScript控制台调用require(["module/name"]，function(){})加载的模块，那么你只需要用到模块名字符串以require()形式获取它。 1require("module/name").callSomeFunction() 注意只有在"module/namae"之前是通过异步版本的require:require(["module/name"])加载时才生效。如果使用相对路径，类似./module/name，只有在define内部才可用。]]></content>
</entry>
<entry>
<title><![CDATA[JavaScript中的类型转换]]></title>
<url>%2F2016%2F12%2F30%2FJavaScript-Type%2F</url>
<content type="text"><![CDATA[JavaScrip中的数据类型分为两类：原始类型(primitive type)和对象类型(object type)。 原始类型包括数字(number),字符串(string),布尔值(boolean),null,undefined。对象类型包括普通对象和内置对象(包装对象String,Number,Boolean;Array,Function,Date,RegExp,全局对象Math,JSON)。 原始值到原始值的转换 undefined,null,0,-0,NaN,””转换为布尔值结果为false,称为falsy value.所有其他值，包括对象都会被转换为true,称为truthy value。 true转换为number时，结果为1,false和空字符串””转换为number时，结果为0。 数字表示的字符串可以直接转换为数字，也允许在开始和结尾处带有空格，但是开始和结尾处的任意非空字符都不被当成数字直接量的一部分，进而造成字符串转换为数字的结果为NaN。 原始值到对象的转换 null和undefined在期望是一个对象的地方都会造成一个类型错误(TypeError)异常，而不会执行正常的转换。 通过调用String(),Number(),Boolean()构造函数转换为它们各自的包装对象。 对象到原始值的转换所有的对象都继承了两个转换方法: toString(),它返回一个反应这个对象的字符串。 valueOf(),如果存在任意原始值，它默认将对象转换为表示它的原始值。对象时复合值，而且大多数对象无法真正表示为一个原始值，因此默认的valueOf()方法简单的返回对象本身，而不是返回一个原始值。特例：Date类定义的valueOf()方法会返回它的一个内部表示：1970年1月1日以来的毫秒数。 对象到字符串转换过程 如果对象具有toString()方法，则调用这个方法。如果它返回一个原始值，JavaScript将这个值转换为字符串（如果本身不是字符串的话），并返回这个字符串结果。 如果对象没有toString()方法，或者这个方法并不返回一个原始值,JavaScript会调用valueOf()方法。如果存在这个方法,JavaScript就会调用它，如果返回结果是原始值,JavaScript将这个值转换为字符串（如果不是字符串），并返回这个字符串结果。 否则，JavaScript无法从toString()或valueOf()获取一个原始值，因此它将抛出一个TypeError异常。 对象到数字转换过程 如果对象具有valueOf()方法，返回一个原始值，则JavaScript将这个原始值转换为数字(如果需要的话)并返回这个数字。 否则，如果对象具有toString()方法，返回一个原始值（字符串直接量），则JavaScript将其转换为数字类型并返回。 否则，JavaScript抛出一个TypeError异常。 “+”和”==”运算符应用到对象到原始值的转换时,如果是日期对象，则先调用toString()方法；如果是其他对象，则先调用valueOf()方法，只要返回了原始值就会直接使用，不会被强制转换为数字或字符串。 “<”,”!=”等关系运算符应用到对象到原始值的转换时，任何对象都会首先尝试调用valueOf()，然后调用toString()。不管得到的原始值是否直接使用，它都不会进一步被转换成数字或字符串。 “-“运算符把它的两个操作数都转换为数字。 示例: 1[]+{} //返回"[object Object]" []调用valueOf()方法返回[]本身，不是原始值，调用toString()返回””,{}调用valueOf()方法返回{}本身，不是原始值，调用toString()返回”[object Object]” 1{}+[] //返回0 {}被JavaScript引擎解析为语句块，因此表达式相当于+[],将[]操作数转换为数字，先调用valueOf()方法返回自身，不是原始值，再调用toString()方法，返回””，是原始值，转换为数字类型为0。 1({}+[]) //返回"[object Object]" 11+[] //返回"1" 先调用valueOf()方法返回自身，不是原始值，再调用toString()方法，返回””，是原始值，不会被强制转换为数字，而是直接使用””,所以结果为”1” 11<new Date() //返回true 先调用valueOf()返回自1970年1月1日以来的毫秒数，为原始值，直接使用，比1大，所以为true.]]></content>
</entry>
<entry>
<title><![CDATA[Hello World]]></title>
<url>%2F2016%2F12%2F28%2Fhello-world%2F</url>
<content type="text"><![CDATA[Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub. Quick StartCreate a new post1$ hexo new "My New Post" More info: Writing Run server1$ hexo server More info: Server Generate static files1$ hexo generate More info: Generating Deploy to remote sites1$ hexo deploy More info: Deployment]]></content>
</entry>
</search>