-
ES6の新機能を学ぶ2 ~デフォルトパラメータとレストパラメータ~
- 2016年2月10日
- ES6
- JavaScript
前回に引き続き、今回はES6(ES2015)の新機能である関数パラメータの拡張についてみていきたい。
ES6では、新たにデフォルトパラメータとレストパラメータという機能が追加された。
デフォルトパラメータは、Ruby等では一般的だが、関数の引数にデフォルト値を設定できるものである。
ES5までは、引数にデフォルト値を持たせたい場合、以下のようにコーディングしていた。
function showMessage(message, person){ message = (message === undefined) ? 'Hello!' : message; person = (person === undefined) ? 'jackson' : person; console.log(message + ', ' + person); }さすがにこれではコードが読みづらい。 ES6では以下のようにパラメータにデフォルト値を持たせることが可能だ。
function showMessage(message='Hello!', person='jackson'){ console.log(message + ', ' + person); }見比べてみると可読性の向上は明らかである。 次にレストパラメータだが、これは関数が可変長の引数を受け取れるというものである。 従来ES5で可変長の引数を受け取るためには、以下のようなコードを書いていた。
function print(){ var args = Array.prototype.slice.call(arguments); args.forEach(function(data){ console.log(data); }); } print('tako', 'ika');関数内でわざわざ
var args = Array.prototype.slice.call(arguments);としているのは、argumentsがArrayに似たオブジェクトであり、Arrayそのものではないため、配列として扱うために変換する必要があるためである。 ES6では以下のように書けるため、コードが非常にシンプルになった。
function print(...rest){ rest.forEach(function(data){ console.log(data); }); } print('tako', 'ika');
この記事を書いた人 : 佐藤冬彦
スタッフブログタグ:
AWS bluebird css CSV docker docker compose electron ES6 es2015 Git Heroku ITコンサルティング JavaScript justinmind less MongoDB Node.js php PostgreSQL Private Space Promise React react-router reactjs Salesforce scss Selenium Builder selenium IDE Selenium WebDriver stylus TypeScript VirtualBox VisualStudioCode vue vuejs webpack システム開発プロジェクト セキュリティ ワイヤーフレーム 上流工程 卒FIT 帳票 要件定義 設計 電力小売業界
一覧へ戻る
AWS bluebird css CSV docker docker compose electron ES6 es2015 Git Heroku ITコンサルティング JavaScript justinmind less MongoDB Node.js php PostgreSQL Private Space Promise React react-router reactjs Salesforce scss Selenium Builder selenium IDE Selenium WebDriver stylus TypeScript VirtualBox VisualStudioCode vue vuejs webpack システム開発プロジェクト セキュリティ ワイヤーフレーム 上流工程 卒FIT 帳票 要件定義 設計 電力小売業界