JavaScript Class super キーワード

CodeW3C オンラインチュートリアル

HTML シリーズチュートリアル
ブラウザースクリプト
サーバースクリプト
プログラミングチュートリアル
XML シリーズチュートリアル
ウェブサイト構築マニュアル
リファレンスマニュアル

カレンダー

JS リファレンスマニュアル

JS リファレンスマニュアル（カテゴリ順）
JS リファレンスマニュアル（アルファベット順）

JavaScript

JS アレイ
JS ブール
JS クラス
JS デート
JS エラ
JS グローバル
JS JSON
JS マップ
JS マシン
JS ナンバー
JS プロミス
JS 正規表現
JS セット
JS ストリング
JS オブジェクト
JS オペレータ
JS オペレータの優先順位
JS ステートメント
JS タイプ化配列

ウィンドウ

Windowオブジェクト
ウィンドウコンソール
ウィンドウヒストリ
ウィンドウロケーション
ウィンドウナビゲーター
ウィンドウスクリーン

HTML DOM

HTML ドキュメント
HTML エレメント
HTML アトレート
HTML イベント
HTML イベントオブジェクト
HTML コレクション
HTML NodeList
HTML DOMTokenリスト
HTML スタイリッシュ

Web API

API カンバス
API コンソール
API フェッチ
API フルスクリーン
API グローバリゼーション
API ヒストリ
API MediaQueryList
API ストレージ
API バリデーション
Web API

HTML オブジェクト

<a>
<abbr>
<address>
<area>
<article>
<aside>
<audio>
<b>
<base>
<bdo>
<blockquote>
<body>
<br>
<button>
<canvas>
<caption>
<cite>
<code>
<col>
<colgroup>
<datalist>
<dd>
<del>
<details>
<dfn>
<dialog>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figcaption>
<figure>
<footer>
<form>
<head>
<header>
<h1> - <h6>
<hr>
<html>
<i>
<iframe>
<img>
<ins>
<input> button
<input> checkbox
<input> color
<input> date
<input> datetime
<input> datetime-local
<input> email
<input> file
<input> hidden
<input> image
<input> month
<input> number
<input> password
<input> radio
<input> range
<input> reset
<input> search
<input> submit
<input> text
<input> time
<input> url
<input> week
<kbd>
<label>
<legend>
<li>
<link>
<map>
<mark>
<menu>
<menuitem>
<meta>
<meter>
<nav>
<object>
<ol>
<optgroup>
<option>
<output>
<p>
<param>
<pre>
<progress>
<q>
<s>
<samp>
<script>
<section>
<select>
<small>
<source>
<span>
<strong>
<sub>
<summary>
<sup>
<table>
<tbody>
<td>
<tfoot>
<th>
<thead>
<tr>
</a></li> <li><a href="/ja/jsref/dom_obj_time.html" title="HTML DOM Time オブジェクト"><time></a></li> <li><a href="/ja/jsref/dom_obj_title.html" title="HTML DOM Title オブジェクト"><textarea></a></li> <li><a href="/ja/jsref/dom_obj_track.html" title="HTML DOM Track オブジェクト"><time></a></li> <li><a href="/ja/jsref/dom_obj_u.html" title="HTML DOM Underline オブジェクト"><title></a></li> <li><a href="/ja/jsref/dom_obj_ul.html" title="HTML DOM Ul オブジェクト"><track></a></li> <li><a href="/ja/jsref/dom_obj_var.html" title="HTML DOM Variable オブジェクト"><u></a></li> <li><a href="/ja/jsref/dom_obj_video.html" title="HTML DOM Video オブジェクト"><ul></a></li> </ul> <h2><var></h2> <ul> <li><a href="/ja/jsref/obj_cssstyledeclaration.html" title="CSSStyleDeclaration オブジェクト"><video></a></li> <li><a href="/ja/jsref/jsref_type_conversion.html" title="JavaScript 型変換">JS 型変換</a></li> </ul> </div> <div><h3><center> 選択科目 </center><h3> <h2>コース推薦：</h2> <ul> <li><a href="/ja/howto/index.html" title="CodeW3C.com バックパック">CodeW3C.com バックパック</a></li> </ul> </div> </div> <div id="maincontent"> <div class="idea"> <a href="/"><button>English</button></a> <a href="/zh/"><button>中文</button></a> <a href="/oldzh/"><button>繁體中文</button></a> <a href="/ru/"><button>Русский</button></a> <a href="/fr/"><button>Français</button></a> <a href="/de/"><button>Deutsch</button></a> <a href="/es/"><button>Español</button></a> <a href="/pt/"><button>Português</button></a> <a href="/ja/"><button>日本語</button></a> <a href="/ko/"><button>한국어</button></a> <a href="/it/"><button>Italiano</button></a> <a href="/ar/"><button>عربي</button></a> <a href="/hi/"><button>हिंदी</button></a> <a href="/bn/"><button>বাংলা</button></a> <a href="/ms/"><button>Bahasa Malaysia</button></a> <a href="/my/"><button>မြန်မာ</button></a> <a href="/vi/"><button>Tiếng Việt</button></a> <a href="/th/"><button>ภาษาไทย</button></a> <a href="/lo/"><button>ລາວ</button></a> <a href="/id/"><button>Bahasa Indonesia</button></a> <a href="/ur/"><button>اردو</button></a> <a href="/ha/"><button>Hausa</button></a> <a href="/pl/"><button>Język polski</button></a> <a href="/pa/"><button>ਪੰਜਾਬੀ</button></a> <a href="/sv/"><button>Svenska</button></a> <a href="/da/"><button>Dansk</button></a> <a href="/nl/"><button>Nederlands</button></a> <a href="/tr/"><button>Türkçe</button></a> <a href="/fi/"><button>suom.</button></a> <a href="/el/"><button>Ελληνικά</button></a> <a href="/fa/"><button>فارسی</button></a> <a href="/sw/"><button>Kiswahili</button></a> <a href="/te/"><button>తెలుగు</button></a> <a href="/tl/"><button>wikang Galu</button></a> </div> <h1>JavaScript Class super キーワード</h1> <div class="prenextnav-ref"> <ul> <li> 前のページ <a href="/ja/jsref/jsref_class_static.html" title="JavaScript Class 静的キーワード">static</a></li> <li> 次のページ <a href="/ja/jsref/jsref_constructor_class.html" title="JavaScript Class constructor メソッド">constructor()</a></li> <li> 上一层に戻る <a href="/ja/jsref/jsref_classes.html" title="JavaScript Classリファレンスマニュアル">JavaScript Classリファレンスマニュアル</a></li> </ul> </div> <div> <h2>定義と使用法</h2> <p><code>super</code> キーワードを親クラスに参照します。</p> <p>親クラスのコンストラクタを呼び出し、親クラスの属性とメソッドにアクセスするために使用されます。</p> <p class="tip"><span>ヒント：</span>「継承」の概念（親クラスと子クラス）をよりよく理解するために、私たちの <a href="/ja/js/js_classes.html" title="JavaScript クラス">JavaScript クラスのチュートリアル</a>。</p> </div> <div> <h2>インスタンス</h2> <p>「Model」というクラスを作成し、以下を使用して <code>extends</code> 「Car」クラスの「継承」キーワードを使用してメソッドを呼び出します。</p> <p>コンストラクタメソッド内で呼び出すことにより <code>super()</code> メソッド、我々は親クラスのコンストラクタを呼び出し、親クラスの属性とメソッドにアクセスすることができます：</p> <pre class="language-js"> class Car { constructor(brand) { this.carname = brand; } present() { return 'I have a ' + this.carname; } } class Model extends Car { constructor(brand, mod) { super(brand); this.model = mod; } show() { return this.present() + ', it is a ' + this.model; } } mycar = new Model("Ford", "Mustang"); document.getElementById("demo").innerHTML = mycar.show(); </pre> <p class="tiy"><a target="_blank" href="/ja/tiy/t.html?f=jsck_class_extends">実際に試してみる</a></p> </div> <div> <h2>文法</h2> <pre class="language-js"> super(<i>arguments</i>); // 親クラスのコンストラクタを呼び出す（コンストラクタ内でのみ） super.parentMethod(<i>arguments</i>); // 親クラスのメソッドを呼び出す </pre> </div> <div> <h2>技術的詳細</h2> <table class="definition-usage"> <tr> <th>JavaScript バージョン：</th> <td>ECMAScript 2015 (ES6)</td> </tr> </table> </div> <div> <h2>ブラウザのサポート</h2> <table class="browser-support"> <tr> <th class="bsTh">キーワード</th> <th class="bsChrome">Chrome</th> <th class="bsIE">IE</th> <th class="bsFirefox">Firefox</th> <th class="bsSafari">Safari</th> <th class="bsOpera">Opera</th> </tr> <tr> <td>super</td> <td>42.0</td> <td>13.0</td> <td>45.0</td> <td>9.0</td> <td>36.0</td> </tr> </table> </div> <div> <h2>関連ページ</h2> <p>JavaScript 教程：<a href="/ja/js/js_classes.html" title="JavaScript クラス">JavaScript クラス</a></p> <p>JavaScript 教程：<a href="/ja/js/js_es6.html" title="ECMAScript 2015 - ES6">JavaScript ES6 (EcmaScript 2015)</a></p> <p>JavaScript リファレンスマニュアル：<a href="/ja/jsref/jsref_class_extends.html" title="JavaScript Class extends キーワード">extends キーワード</a></p> <p>JavaScript リファレンスマニュアル：<a href="/ja/jsref/jsref_constructor_class.html" title="JavaScript Class constructor メソッド">constructor() メソッド</a></p> </div> <div class="prenextnav-ref"> <ul> <li> 前のページ <a href="/ja/jsref/jsref_class_static.html" title="JavaScript Class 静的キーワード">static</a></li> <li> 次のページ <a href="/ja/jsref/jsref_constructor_class.html" title="JavaScript Class constructor メソッド">constructor()</a></li> <li> 上一层に戻る <a href="/ja/jsref/jsref_classes.html" title="JavaScript Classリファレンスマニュアル">JavaScript Classリファレンスマニュアル</a></li> </ul> </div><div style="background-color:#fcfdf8; padding:0;"> </div> </div>  <div id="sidebar"> <div><h3><center> ツールボックス </center><h3> <h5 id="tools_reference"><a href="/ja/jsref/index.html">JavaScriptおよびHTML DOMリファレンスマニュアル</a></h5> <h5 id="tools_example"><a href="/ja/js/js_examples.html">JavaScript 例</a></h5> <h5 id="tools_quiz"><a href="/ja/js/js_quiz.html">JavaScript テスト</a></h5> <h5 id="tools_tutorial"><a href="/ja/js/index.html">JavaScript チュートリアル</a></h5> </div> <div><h3><center> スポンサーリンク </center><h3> <div id="sbtg"> <script src="/myjs/zzsr.js"></script> </div> </div> </div> <div id="footer"> <p id="p1"> CodeW3C.com が提供するコンテンツは教育とテストのためにのみ使用され、内容の正確性を保証しません。本サイトのコンテンツを使用することで生じるリスクは本サイトとは関係ありません。著作権所有、全ての権利を保留します。 </p> <p id="p2"> <a href="/ja/about/index.html" title="CodeW3C.com について">CodeW3C.com について</a> <a href="/ja/about/about_helping.html" title="CodeW3C.com 助手">CodeW3C.com 助手</a> <a href="/ja/about/about_use.html" title="使用方法について">利用規約</a> <a href="/ja/about/about_privacy.html" title="プライバシーについて">プライバシーポリシー</a> <a href="http://www.comfortsoftwaregroup.com/" target="_blank"><img src="/comfortsoftwaregroup.png"></a> <a href="http://www.ce4e.com/" target="_blank"><img src="/poweredby.png" alt="Ce4e.comで動作"></a> </p> </div> </div>  <script src="/myjs/tongji.js"></script> </body> </html>