Progate学習メモ　JavaScriptⅤ【ファイルを分割する】

書き方例

class Cat {　・・・

}

export default Cat；　　　　→　ほかのファイルでも使えるようにする設定部分

• 末尾コンマが必要！忘れないように。

【書き方】

import Cat from “./cat“；

　　クラス名　　ファイル名

• 子クラスファイルの先頭で、「import クラス名 from “./ファイル名”」と書く。
• ファイル名の拡張子「.js」は省略できる

【書き方】

＜room1.js＞

const text = “ありがとさん”；

export default text;

<room2>

import text from “./room1”;

console.log(text);　　　　→　「ありがとさん」と出力される

デフォルトエクスポートの注意

• デフォルトエクスポートは、１つのファイルに１つの値にしか使えない
• 複数エクスポートしたいときは、名前付きエクスポートを使う

書き方

＜room1.js＞

const cat1 = new Cat(“ピノ”，17，”茶白”);

export { cat1 } ;

<room2>

import { cat1 } from “./room1”;

cat1.info();

• 名前付きエクスポートした値をインポートする場合は、エクスポート時と同じ名前にする
• インポートするときも、エクスポートするときも値を{　}で囲む
• エクスポートする際に、「default」は不要

【書き方】

＜room1.js＞

const cat1 = new Cat(“ピノ”，17，”茶白”);

const cat2 = new Cat(“もんた”，14，”茶トラ”);

export { cat1，cat2 } ;

<room2>

import { cat1，cat2 } from “./room1”;

cat1.info();

cat2.info();

• 「export { 名前1, 名前2 }」という形で書くことにより、1つのファイルから複数のエクスポートが出来る。

【書き方】

import Cat1 from “../family2/cat2“;

1. 　　：一つ上の階層に移動
2. 　　：family2ファイルに移動
3. 　　：cat2.jsを指定

書き方

import 定数名from “パッケージ名”;

• 「./」はいらないので注意

【例：chalkパッケージの使い方】

import chalk from “chalk”;

console.log(chalk.yellow(“お疲れさん”))；

　　　　　　↑文字列を囲む

書き方

import readlineSync from “readline-sync”;

readlineSync.question(“名前を入力してください：”)；

• インポートしたあと、readlineSync.question(質問文) と書く。
• 質問文が出力されると一旦処理が止まり、コンソールに値が入力されると、次の処理に進む。

【書き方②】

import readlineSync from “readline-sync”;

const name = readlineSync.question(“名前を入力してください：”)；

console.log(`${name}と入力されました`)；

名前を入力してください：ピノ　　　←　ここに「ピノ」と入力すると、name=ピノになる

ピノと入力されました

• 文字列の場合：const name = readlineSync.question(“名前を入力してください：”)；
• 整数の場合：const age = readlineSync.questionInt(“名前を入力してください：”)；