1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JavaScript~ファイルの分割

Posted at

#JavaScript~ファイルの分割
##ファイルの分割
###ファイル構成

root/
 ├ animal.js
 ├ dog.js
 └ script.js

###ファイルの中身

animal.js
class Animal {
}
// Animalクラスをエクスポート
export default Animal;
dog.js
// Animalクラスをインポート
import Animal from "./animal";

class Dog extends Animal {
}
// Dogクラスをエクスポート
export default Dog;
script.js
// Dogクラスをインポート
import Dog from "./dog";

//スクリプト処理を記載

##名前つきエクスポート
###ファイル構成

root/
 ├ animal.js
 ├ dog.js
 ├ dogData.js
 └ script.js

###ファイルの中身

animal.js
class Animal {
}
// Animalクラスをエクスポート
export default Animal;
dog.js
// Animalクラスをインポート
import Animal from "./animal";

class Dog extends Animal {
}
// Dogクラスをエクスポート
export default Dog;
dogData.js
//Dogクラスをインポート
import Dog from "./dog";

//定数dog1, dog2を設定
const dog1 = new Dog("A");
const dog2 = new Dog("B");

//定数dog1, dog2をエクスポート
export {dog1, dog2};
script.js
//定数dog1、dog2をインポート
import {dog1, dog2} from "./dogData";

//スクリプト処理を記載
dog1.something();
dog2.something();
1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?