<ruby id="bdb3f"></ruby>

    <p id="bdb3f"><cite id="bdb3f"></cite></p>

      <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
        <p id="bdb3f"><cite id="bdb3f"></cite></p>

          <pre id="bdb3f"></pre>
          <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

          <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
          <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

          <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                <ruby id="bdb3f"></ruby>

                ThinkChat2.0新版上線,更智能更精彩,支持會話、畫圖、視頻、閱讀、搜索等,送10W Token,即刻開啟你的AI之旅 廣告
                # ECMAScript 6簡介 ECMAScript 6.0(以下簡稱ES6)是JavaScript語言的下一代標準,已經在2015年6月正式發布了。它的目標,是使得JavaScript語言可以用來編寫復雜的大型應用程序,成為企業級開發語言。 標準的制定者有計劃,以后每年發布一次標準,使用年份作為版本。因為ES6的第一個版本是在2015年發布的,所以又稱ECMAScript 2015(簡稱ES2015)。 2016年6月,小幅修訂的《ECMAScript 2016 標準》(簡稱 ES2016)如期發布。由于變動非常小(只新增了數組實例的`includes`方法和指數運算符),因此 ES2016 與 ES2015 基本上是同一個標準,都被看作是 ES6。根據計劃,2017年6月將發布 ES2017。 ## ECMAScript和JavaScript的關系 一個常見的問題是,ECMAScript和JavaScript到底是什么關系? 要講清楚這個問題,需要回顧歷史。1996年11月,JavaScript的創造者Netscape公司,決定將JavaScript提交給國際標準化組織ECMA,希望這種語言能夠成為國際標準。次年,ECMA發布262號標準文件(ECMA-262)的第一版,規定了瀏覽器腳本語言的標準,并將這種語言稱為ECMAScript,這個版本就是1.0版。 該標準從一開始就是針對JavaScript語言制定的,但是之所以不叫JavaScript,有兩個原因。一是商標,Java是Sun公司的商標,根據授權協議,只有Netscape公司可以合法地使用JavaScript這個名字,且JavaScript本身也已經被Netscape公司注冊為商標。二是想體現這門語言的制定者是ECMA,不是Netscape,這樣有利于保證這門語言的開放性和中立性。 因此,ECMAScript和JavaScript的關系是,前者是后者的規格,后者是前者的一種實現(另外的ECMAScript方言還有Jscript和ActionScript)。日常場合,這兩個詞是可以互換的。 ## ECMAScript的歷史 ES6從開始制定到最后發布,整整用了15年。 前面提到,ECMAScript 1.0是1997年發布的,接下來的兩年,連續發布了ECMAScript 2.0(1998年6月)和ECMAScript 3.0(1999年12月)。3.0版是一個巨大的成功,在業界得到廣泛支持,成為通行標準,奠定了JavaScript語言的基本語法,以后的版本完全繼承。直到今天,初學者一開始學習JavaScript,其實就是在學3.0版的語法。 2000年,ECMAScript 4.0開始醞釀。這個版本最后沒有通過,但是它的大部分內容被ES6繼承了。因此,ES6制定的起點其實是2000年。 為什么ES4沒有通過呢?因為這個版本太激進了,對ES3做了徹底升級,導致標準委員會的一些成員不愿意接受。ECMA的第39號技術專家委員會(Technical Committee 39,簡稱TC39)負責制訂ECMAScript標準,成員包括Microsoft、Mozilla、Google等大公司。 2007年10月,ECMAScript 4.0版草案發布,本來預計次年8月發布正式版本。但是,各方對于是否通過這個標準,發生了嚴重分歧。以Yahoo、Microsoft、Google為首的大公司,反對JavaScript的大幅升級,主張小幅改動;以JavaScript創造者Brendan Eich為首的Mozilla公司,則堅持當前的草案。 2008年7月,由于對于下一個版本應該包括哪些功能,各方分歧太大,爭論過于激烈,ECMA開會決定,中止ECMAScript 4.0的開發,將其中涉及現有功能改善的一小部分,發布為ECMAScript 3.1,而將其他激進的設想擴大范圍,放入以后的版本,由于會議的氣氛,該版本的項目代號起名為Harmony(和諧)。會后不久,ECMAScript 3.1就改名為ECMAScript 5。 2009年12月,ECMAScript 5.0版正式發布。Harmony項目則一分為二,一些較為可行的設想定名為JavaScript.next繼續開發,后來演變成ECMAScript 6;一些不是很成熟的設想,則被視為JavaScript.next.next,在更遠的將來再考慮推出。TC39委員會的總體考慮是,ES5與ES3基本保持兼容,較大的語法修正和新功能加入,將由JavaScript.next完成。當時,JavaScript.next指的是ES6,第六版發布以后,就指ES7。TC39的判斷是,ES5會在2013年的年中成為JavaScript開發的主流標準,并在此后五年中一直保持這個位置。 2011年6月,ECMAscript 5.1版發布,并且成為ISO國際標準(ISO/IEC 16262:2011)。 2013年3月,ECMAScript 6草案凍結,不再添加新功能。新的功能設想將被放到ECMAScript 7。 2013年12月,ECMAScript 6草案發布。然后是12個月的討論期,聽取各方反饋。 2015年6月,ECMAScript 6正式通過,成為國際標準。從2000年算起,這時已經過去了15年。 ## 部署進度 各大瀏覽器的最新版本,對ES6的支持可以查看[kangax.github.io/es5-compat-table/es6/](http://kangax.github.io/es5-compat-table/es6/)。隨著時間的推移,支持度已經越來越高了,ES6的大部分特性都實現了。 Node.js是JavaScript語言的服務器運行環境,對ES6的支持度比瀏覽器更高。通過Node,可以體驗更多ES6的特性。建議使用版本管理工具[nvm](https://github.com/creationix/nvm),來安裝Node,因為可以自由切換版本。不過,`nvm`不支持Windows系統,如果你使用Windows系統,下面的操作可以改用[nvmw](https://github.com/hakobera/nvmw)或[nvm-windows](https://github.com/coreybutler/nvm-windows)代替。 安裝nvm需要打開命令行窗口,運行下面的命令。 ~~~ $ curl -o- https://raw.githubusercontent.com/creationix/nvm/<version number>/install.sh | bash ~~~ 上面命令的`version number`處,需要用版本號替換。本節寫作時的版本號是`v0.29.0`。該命令運行后,`nvm`會默認安裝在用戶主目錄的`.nvm`子目錄。 然后,激活`nvm`。 ~~~ $ source ~/.nvm/nvm.sh ~~~ 激活以后,安裝Node的最新版。 ~~~ $ nvm install node ~~~ 安裝完成后,切換到該版本。 ~~~ $ nvm use node ~~~ 使用下面的命令,可以查看Node所有已經實現的ES6特性。 ~~~ $ node --v8-options | grep harmony --harmony_typeof --harmony_scoping --harmony_modules --harmony_symbols --harmony_proxies --harmony_collections --harmony_observation --harmony_generators --harmony_iteration --harmony_numeric_literals --harmony_strings --harmony_arrays --harmony_maths --harmony ~~~ 上面命令的輸出結果,會因為版本的不同而有所不同。 我寫了一個[ES-Checker](https://github.com/ruanyf/es-checker)模塊,用來檢查各種運行環境對ES6的支持情況。訪問[ruanyf.github.io/es-checker](http://ruanyf.github.io/es-checker),可以看到您的瀏覽器支持ES6的程度。運行下面的命令,可以查看你正在使用的Node環境對ES6的支持程度。 ~~~ $ npm install -g es-checker $ es-checker ========================================= Passes 24 feature Dectations Your runtime supports 57% of ECMAScript 6 ========================================= ~~~ ## Babel轉碼器 [Babel](https://babeljs.io/)是一個廣泛使用的ES6轉碼器,可以將ES6代碼轉為ES5代碼,從而在現有環境執行。這意味著,你可以用ES6的方式編寫程序,又不用擔心現有環境是否支持。下面是一個例子。 ~~~ // 轉碼前 input.map(item => item + 1); // 轉碼后 input.map(function (item) { return item + 1; }); ~~~ 上面的原始代碼用了箭頭函數,這個特性還沒有得到廣泛支持,Babel將其轉為普通函數,就能在現有的JavaScript環境執行了。 ### 配置文件`.babelrc` Babel的配置文件是`.babelrc`,存放在項目的根目錄下。使用Babel的第一步,就是配置這個文件。 該文件用來設置轉碼規則和插件,基本格式如下。 ~~~ { "presets": [], "plugins": [] } ~~~ `presets`字段設定轉碼規則,官方提供以下的規則集,你可以根據需要安裝。 ~~~ # ES2015轉碼規則 $ npm install --save-dev babel-preset-es2015 # react轉碼規則 $ npm install --save-dev babel-preset-react # ES7不同階段語法提案的轉碼規則(共有4個階段),選裝一個 $ npm install --save-dev babel-preset-stage-0 $ npm install --save-dev babel-preset-stage-1 $ npm install --save-dev babel-preset-stage-2 $ npm install --save-dev babel-preset-stage-3 ~~~ 然后,將這些規則加入`.babelrc`。 ~~~ { "presets": [ "es2015", "react", "stage-2" ], "plugins": [] } ~~~ 注意,以下所有Babel工具和模塊的使用,都必須先寫好`.babelrc`。 ### 命令行轉碼`babel-cli` Babel提供`babel-cli`工具,用于命令行轉碼。 它的安裝命令如下。 ~~~ $ npm install --global babel-cli ~~~ 基本用法如下。 ~~~ # 轉碼結果輸出到標準輸出 $ babel example.js # 轉碼結果寫入一個文件 # --out-file 或 -o 參數指定輸出文件 $ babel example.js --out-file compiled.js # 或者 $ babel example.js -o compiled.js # 整個目錄轉碼 # --out-dir 或 -d 參數指定輸出目錄 $ babel src --out-dir lib # 或者 $ babel src -d lib # -s 參數生成source map文件 $ babel src -d lib -s ~~~ 上面代碼是在全局環境下,進行Babel轉碼。這意味著,如果項目要運行,全局環境必須有Babel,也就是說項目產生了對環境的依賴。另一方面,這樣做也無法支持不同項目使用不同版本的Babel。 一個解決辦法是將`babel-cli`安裝在項目之中。 ~~~ # 安裝 $ npm install --save-dev babel-cli ~~~ 然后,改寫`package.json`。 ~~~ { // ... "devDependencies": { "babel-cli": "^6.0.0" }, "scripts": { "build": "babel src -d lib" }, } ~~~ 轉碼的時候,就執行下面的命令。 ~~~ $ npm run build ~~~ ### babel-node `babel-cli`工具自帶一個`babel-node`命令,提供一個支持ES6的REPL環境。它支持Node的REPL環境的所有功能,而且可以直接運行ES6代碼。 它不用單獨安裝,而是隨`babel-cli`一起安裝。然后,執行`babel-node`就進入REPL環境。 ~~~ $ babel-node > (x => x * 2)(1) 2 ~~~ `babel-node`命令可以直接運行ES6腳本。將上面的代碼放入腳本文件`es6.js`,然后直接運行。 ~~~ $ babel-node es6.js 2 ~~~ `babel-node`也可以安裝在項目中。 ~~~ $ npm install --save-dev babel-cli ~~~ 然后,改寫`package.json`。 ~~~ { "scripts": { "script-name": "babel-node script.js" } } ~~~ 上面代碼中,使用`babel-node`替代`node`,這樣`script.js`本身就不用做任何轉碼處理。 ### babel-register `babel-register`模塊改寫`require`命令,為它加上一個鉤子。此后,每當使用`require`加載`.js`、`.jsx`、`.es`和`.es6`后綴名的文件,就會先用Babel進行轉碼。 ~~~ $ npm install --save-dev babel-register ~~~ 使用時,必須首先加載`babel-register`。 ~~~ require("babel-register"); require("./index.js"); ~~~ 然后,就不需要手動對`index.js`轉碼了。 需要注意的是,`babel-register`只會對`require`命令加載的文件轉碼,而不會對當前文件轉碼。另外,由于它是實時轉碼,所以只適合在開發環境使用。 ### babel-core 如果某些代碼需要調用Babel的API進行轉碼,就要使用`babel-core`模塊。 安裝命令如下。 ~~~ $ npm install babel-core --save ~~~ 然后,在項目中就可以調用`babel-core`。 ~~~ var babel = require('babel-core'); // 字符串轉碼 babel.transform('code();', options); // => { code, map, ast } // 文件轉碼(異步) babel.transformFile('filename.js', options, function(err, result) { result; // => { code, map, ast } }); // 文件轉碼(同步) babel.transformFileSync('filename.js', options); // => { code, map, ast } // Babel AST轉碼 babel.transformFromAst(ast, code, options); // => { code, map, ast } ~~~ 配置對象`options`,可以參看官方文檔[http://babeljs.io/docs/usage/options/](http://babeljs.io/docs/usage/options/)。 下面是一個例子。 ~~~ var es6Code = 'let x = n => n + 1'; var es5Code = require('babel-core') .transform(es6Code, { presets: ['es2015'] }) .code; // '"use strict";\n\nvar x = function x(n) {\n return n + 1;\n};' ~~~ 上面代碼中,`transform`方法的第一個參數是一個字符串,表示需要被轉換的ES6代碼,第二個參數是轉換的配置對象。 ### babel-polyfill Babel默認只轉換新的JavaScript句法(syntax),而不轉換新的API,比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局對象,以及一些定義在全局對象上的方法(比如`Object.assign`)都不會轉碼。 舉例來說,ES6在`Array`對象上新增了`Array.from`方法。Babel就不會轉碼這個方法。如果想讓這個方法運行,必須使用`babel-polyfill`,為當前環境提供一個墊片。 安裝命令如下。 ~~~ $ npm install --save babel-polyfill ~~~ 然后,在腳本頭部,加入如下一行代碼。 ~~~ import 'babel-polyfill'; // 或者 require('babel-polyfill'); ~~~ Babel默認不轉碼的API非常多,詳細清單可以查看`babel-plugin-transform-runtime`模塊的[definitions.js](https://github.com/babel/babel/blob/master/packages/babel-plugin-transform-runtime/src/definitions.js)文件。 ### 瀏覽器環境 Babel也可以用于瀏覽器環境。但是,從Babel 6.0開始,不再直接提供瀏覽器版本,而是要用構建工具構建出來。如果你沒有或不想使用構建工具,可以通過安裝5.x版本的`babel-core`模塊獲取。 ~~~ $ npm install babel-core@5 ~~~ 運行上面的命令以后,就可以在當前目錄的`node_modules/babel-core/`子目錄里面,找到`babel`的瀏覽器版本`browser.js`(未精簡)和`browser.min.js`(已精簡)。 然后,將下面的代碼插入網頁。 ~~~ <script src="node_modules/babel-core/browser.js"></script> <script type="text/babel"> // Your ES6 code </script> ~~~ 上面代碼中,`browser.js`是Babel提供的轉換器腳本,可以在瀏覽器運行。用戶的ES6腳本放在`script`標簽之中,但是要注明`type="text/babel"`。 另一種方法是使用[babel-standalone](https://github.com/Daniel15/babel-standalone)模塊提供的瀏覽器版本,將其插入網頁。 ~~~ <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.4.4/babel.min.js"></script> <script type="text/babel"> // Your ES6 code </script> ~~~ 注意,網頁中實時將ES6代碼轉為ES5,對性能會有影響。生產環境需要加載已經轉碼完成的腳本。 下面是如何將代碼打包成瀏覽器可以使用的腳本,以`Babel`配合`Browserify`為例。首先,安裝`babelify`模塊。 ~~~ $ npm install --save-dev babelify babel-preset-es2015 ~~~ 然后,再用命令行轉換ES6腳本。 ~~~ $ browserify script.js -o bundle.js \ -t [ babelify --presets [ es2015 ] ] ~~~ 上面代碼將ES6腳本`script.js`,轉為`bundle.js`,瀏覽器直接加載后者就可以了。 在`package.json`設置下面的代碼,就不用每次命令行都輸入參數了。 ~~~ { "browserify": { "transform": [["babelify", { "presets": ["es2015"] }]] } } ~~~ ### 在線轉換 Babel提供一個[REPL在線編譯器](https://babeljs.io/repl/),可以在線將ES6代碼轉為ES5代碼。轉換后的代碼,可以直接作為ES5代碼插入網頁運行。 ### 與其他工具的配合 許多工具需要Babel進行前置轉碼,這里舉兩個例子:ESLint和Mocha。 ESLint用于靜態檢查代碼的語法和風格,安裝命令如下。 ~~~ $ npm install --save-dev eslint babel-eslint ~~~ 然后,在項目根目錄下,新建一個配置文件`.eslintrc`,在其中加入`parser`字段。 ~~~ { "parser": "babel-eslint", "rules": { ... } } ~~~ 再在`package.json`之中,加入相應的`scripts`腳本。 ~~~ { "name": "my-module", "scripts": { "lint": "eslint my-files.js" }, "devDependencies": { "babel-eslint": "...", "eslint": "..." } } ~~~ Mocha則是一個測試框架,如果需要執行使用ES6語法的測試腳本,可以修改`package.json`的`scripts.test`。 ~~~ "scripts": { "test": "mocha --ui qunit --compilers js:babel-core/register" } ~~~ 上面命令中,`--compilers`參數指定腳本的轉碼器,規定后綴名為`js`的文件,都需要使用`babel-core/register`先轉碼。 ## Traceur轉碼器 Google公司的[Traceur](https://github.com/google/traceur-compiler)轉碼器,也可以將ES6代碼轉為ES5代碼。 ### 直接插入網頁 Traceur允許將ES6代碼直接插入網頁。首先,必須在網頁頭部加載Traceur庫文件。 ~~~ <script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script> <script src="https://google.github.io/traceur-compiler/bin/BrowserSystem.js"></script> <script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script> <script type="module"> import './Greeter.js'; </script> ~~~ 上面代碼中,一共有4個`script`標簽。第一個是加載Traceur的庫文件,第二個和第三個是將這個庫文件用于瀏覽器環境,第四個則是加載用戶腳本,這個腳本里面可以使用ES6代碼。 注意,第四個`script`標簽的`type`屬性的值是`module`,而不是`text/javascript`。這是Traceur編譯器識別ES6代碼的標志,編譯器會自動將所有`type=module`的代碼編譯為ES5,然后再交給瀏覽器執行。 除了引用外部ES6腳本,也可以直接在網頁中放置ES6代碼。 ~~~ <script type="module"> class Calc { constructor(){ console.log('Calc constructor'); } add(a, b){ return a + b; } } var c = new Calc(); console.log(c.add(4,5)); </script> ~~~ 正常情況下,上面代碼會在控制臺打印出9。 如果想對Traceur的行為有精確控制,可以采用下面參數配置的寫法。 ~~~ <script> // Create the System object window.System = new traceur.runtime.BrowserTraceurLoader(); // Set some experimental options var metadata = { traceurOptions: { experimental: true, properTailCalls: true, symbols: true, arrayComprehension: true, asyncFunctions: true, asyncGenerators: exponentiation, forOn: true, generatorComprehension: true } }; // Load your module System.import('./myModule.js', {metadata: metadata}).catch(function(ex) { console.error('Import failed', ex.stack || ex); }); </script> ~~~ 上面代碼中,首先生成Traceur的全局對象`window.System`,然后`System.import`方法可以用來加載ES6模塊。加載的時候,需要傳入一個配置對象`metadata`,該對象的`traceurOptions`屬性可以配置支持ES6功能。如果設為`experimental: true`,就表示除了ES6以外,還支持一些實驗性的新功能。 ### 在線轉換 Traceur也提供一個[在線編譯器](http://google.github.io/traceur-compiler/demo/repl.html),可以在線將ES6代碼轉為ES5代碼。轉換后的代碼,可以直接作為ES5代碼插入網頁運行。 上面的例子轉為ES5代碼運行,就是下面這個樣子。 ~~~ <script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script> <script src="https://google.github.io/traceur-compiler/bin/BrowserSystem.js"></script> <script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script> <script> $traceurRuntime.ModuleStore.getAnonymousModule(function() { "use strict"; var Calc = function Calc() { console.log('Calc constructor'); }; ($traceurRuntime.createClass)(Calc, {add: function(a, b) { return a + b; }}, {}); var c = new Calc(); console.log(c.add(4, 5)); return {}; }); </script> ~~~ ### 命令行轉換 作為命令行工具使用時,Traceur是一個Node的模塊,首先需要用Npm安裝。 ~~~ $ npm install -g traceur ~~~ 安裝成功后,就可以在命令行下使用Traceur了。 Traceur直接運行es6腳本文件,會在標準輸出顯示運行結果,以前面的`calc.js`為例。 ~~~ $ traceur calc.js Calc constructor 9 ~~~ 如果要將ES6腳本轉為ES5保存,要采用下面的寫法。 ~~~ $ traceur --script calc.es6.js --out calc.es5.js ~~~ 上面代碼的`--script`選項表示指定輸入文件,`--out`選項表示指定輸出文件。 為了防止有些特性編譯不成功,最好加上`--experimental`選項。 ~~~ $ traceur --script calc.es6.js --out calc.es5.js --experimental ~~~ 命令行下轉換生成的文件,就可以直接放到瀏覽器中運行。 ### Node.js環境的用法 Traceur的Node.js用法如下(假定已安裝traceur模塊)。 ~~~ var traceur = require('traceur'); var fs = require('fs'); // 將ES6腳本轉為字符串 var contents = fs.readFileSync('es6-file.js').toString(); var result = traceur.compile(contents, { filename: 'es6-file.js', sourceMap: true, // 其他設置 modules: 'commonjs' }); if (result.error) throw result.error; // result對象的js屬性就是轉換后的ES5代碼 fs.writeFileSync('out.js', result.js); // sourceMap屬性對應map文件 fs.writeFileSync('out.js.map', result.sourceMap); ~~~ ## ECMAScript 7 2013年3月,ES6的草案封閉,不再接受新功能了。新的功能將被加入ES7。 任何人都可以向TC39提案,從提案到變成正式標準,需要經歷五個階段。每個階段的變動都需要由TC39委員會批準。 * Stage 0 - Strawman(展示階段) * Stage 1 - Proposal(征求意見階段) * Stage 2 - Draft(草案階段) * Stage 3 - Candidate(候選人階段) * Stage 4 - Finished(定案階段) 一個提案只要能進入Stage 2,就差不多等于肯定會包括在ES7里面。 本書的寫作目標之一,是跟蹤ECMAScript語言的最新進展。對于那些明確的、或者很有希望列入ES7的功能,尤其是那些Babel已經支持的功能,都將予以介紹。 本書介紹的ES7功能清單如下。 **Stage 0**: * Function Bind Syntax:函數的綁定運算符 * String.prototype.at:字符串的靜態方法at **Stage 1**: * Class and Property Decorators:Class的修飾器 * Class Property Declarations:Class的屬性聲明 * Additional export-from Statements:export的寫法改進 * String.prototype.{trimLeft,trimRight}:字符串刪除頭尾空格的方法 **Stage 2**: * Rest/Spread Properties:對象的Rest參數和擴展運算符 **Stage 3** * SIMD API:“單指令,多數據”命令集 * Async Functions:async函數 * Object.values/Object.entries:Object的靜態方法values()和entries() * String padding:字符串長度補全 * Trailing commas in function parameter lists and calls:函數參數的尾逗號 * Object.getOwnPropertyDescriptors:Object的靜態方法getOwnPropertyDescriptors **Stage 4**: * Array.prototype.includes:數組實例的includes方法 * Exponentiation Operator:指數運算符 ECMAScript當前的所有提案,可以在TC39的官方網站[Github.com/tc39/ecma262](https://github.com/tc39/ecma262)查看。 Babel轉碼器可以通過安裝和使用插件來使用各個stage的語法。
                  <ruby id="bdb3f"></ruby>

                  <p id="bdb3f"><cite id="bdb3f"></cite></p>

                    <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
                      <p id="bdb3f"><cite id="bdb3f"></cite></p>

                        <pre id="bdb3f"></pre>
                        <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

                        <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
                        <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

                        <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                              <ruby id="bdb3f"></ruby>

                              哎呀哎呀视频在线观看