JavaScript遣いのための「Dart 簡易まとめ」 (Flutter学習前段階)

Dartのチートシート的なもの
Flutterを学ぶ前にまとめてみました。

私が実際に見てDartを学んだおすすめの動画はこちら

↓

型

変数定義

型を宣言して定義

String name = "panshoku";
int age = 100;
double width = 0.25;
bool isTall = false;

List<String> nameList = ["panshoku", "gohan"];

Map<int, String> nameMap = {
  10: "panshoku",
  20: "gohan",
};

Map<String, dynamic> person = {
  'name': 'Alice',
  'age': 30,
  'isStudent': false,
  'scores': [90, 85, 95],
};

リスト・マップ

取り出し方

nameList[0]; // panshoku
nameMap[10]; // panshoku

Function 関数・メソッド

書き方比較

※デフォルト値の設定・nullableについては後述

例

void basicFunc(int sumNum) {
    int age = 100;
    print(age + x);
}
basicFunc(20); // 120

void mapFunc({int age, int sumNum}) {
    print((age ?? 0) + (sumNum ?? 0));
}

// ！波かっこ不要！
mapFunc(sumNum: 20, age: 100); // 120
mapFunc(age: 100); // 100
mapFunc(); // 0

void listFunc([int age, int multipleNum]) {
    int twice = (multipleNum ?? 0) * 2;
    print((age ?? 0) * twice);
}

// key不要
listFunc(100, 2); // 100 * (2 * 2) = 400
listFunc(2, 10); // 2 * (10 * 2) = 40
listFunc(100); // 100 * (0 * 2) = 0
listFunc(); // 0 * (0 * 2) = 0

String stringFunc(){
    return "panshoku";
}

String name = stringFunc(); // panshoku

String arrowFunc() => "panshoku" // return と同意

String name = arrowFunc(); // panshoku

nullable (nullを許容する)

書き方

typeScriptでいうオプショナルみたいな書き方ができる

String? name = null;

void basicFunc(int?: a, int?: b) {
  // nullの時の条件分岐など必要
}

※ mapFunc や listFunc は、すでに nullable

引数にデフォルト値を指定する

void basicFunc(int: a = 0, int: b = 0) {
  ...
}
void mapFunc({int: a = 0, int: b = 0}) {
  ...
}
void listFunc([int: a = 0, int: b = 0]) {
  ...
}

Future

async が必要

Future<void> awaitFinish() async {
    print("start");
    // print finish after 3seconds
    await Future.delayed(Duration(seconds: 3));
    print("finish");
}
awaitFinish();

定数

const String name = "panshoku"

final String name = "panshoku"

// ok
String name = "panshoku";
final String name2 = name;
※ name2 = "木村" 定数なのでできない

// ng
String name = "panshoku";
const String name2 = name;

クラス

class Person {
  String name;
  int age;

  // コンストラクター
  Person({this.name, this.age});
}

List<Person> personList = [
    Person(name: "田中", age: 12),
    Person(name: "木村", age: 12),
]

class Person {
  String name;
  int age;

  // コンストラクター
  Person(this.name, this.age);
}

List<Person> personList = [
    Person("田中", 12),
    Person("木村", 12),
]

class Person {
  String name;
  int age;

  // コンストラクター
  Person([this.name, this.age]);
}

List<Person> personList = [
    Person("田中", 12),
    Person("木村", 12),
]

プライベート

他からアクセスできないようにする。_をつける。

// person.dart
class Person {
  String name = "パン";
  int _age = 21;
}

// main.dart
import "person.dart";

Person personInstance = Person():

print(personInstance.name);
print(personInstance._age); // エラー

スタティック

インスタンス化なしでアクセスできる。staticをつける。

// person.dart
class Person {
  String name = "パン;
  static int age = 23;
}

// main.dart
import "person.dart";

print(Person.age); // これで呼べる

比較

代入

String name = "パン";
print(name); // パン

name = "ごはん"; // 上書きできる
print(name); // ごはん

演算子

計算 (算術演算子 / 代入演算子)

算術演算子: + – * / % ~/
代入演算子: += -= *= /=

比較演算子

論理演算子

三項演算子 ? :

  int age = 10;
  int age2 = 20;

  String result = age > age2 ? 'ageはage2より大きい' : 'ageはage2より小さいまたは等しい';
  print(result); // ageはage2より小さいまたは等しい

スコープ

グローバルスコープ

プログラム全体でアクセス可能

int age1 = 25; // グローバル変数

void main() {
  print(age1); // 25 を出力
}

ローカルスコープ

その関数やブロック内でのみアクセス可能

void main() {
  int age2 = 30; // ローカル変数

  if (true) {
    int age3 = 35; // ローカル変数（ブロックスコープ）
    print(age2); // 30 を出力
    print(age3); // 35 を出力
  }

  print(age2); // 30 を出力
  // print(age3); // エラー：age3はこのスコープではアクセスできません
}

条件分岐

if ~ else if ~ else

  int num = 10;

  if (num > 20) {
    print('numは20より大きい');
  } else if (num > 10) {
    print('numは10より大きいが、20以下');
  } else if (num == 10) {
    print('numは10です');
  } else {
    print('numは10以下');
  }

switch ~ case ~ default

void main() {
  int age = 18;

  switch (age) {
    case 16:
      print('16歳です。');
      break;
    case 18:
      print('18歳です。'); // これが出力される
      break;
    case 21:
      print('21歳です。');
      break;
    default:
      print('その他の年齢です。');
  }
}

enum 列挙型

• あらかじめ値を定義しておくクラス。名前付き定数郡。
• コードの可読性と整合性が向上
  • switch文のcaseなどで、文字列だとミスに気付きにくい
  • enumを使うと良い（TypeScriptみたい）

// Seasonという名前の列挙型を定義
enum Season {
  spring,
  summer,
  autumn,
  winter
}


void main() {
　// 使い方
  Season currentSeason = Season.summer;


　// こういうときに使いたい
  switch (currentSeason) {

    case Season.spring:
      print('春です。');
      break;

    // 文字列だと case "sammer" というタイポに気付きづらい
    case Season.summer:
      print('夏です。');
      break;

    case Season.autumn:
      print('秋です。');
      break;

    case Season.winter:
      print('冬です。');
      break;
  }
}

ループ

// for
for (int i = 0; i < 5; i++) {
  print('繰り返し $i');
}


// for - in
List<String> fruits = ['apple', 'banana', 'orange'];

for (String fruit in fruits) {
  print('フルーツ: $fruit');
}

Map<String, int> scores = {
  'Alice': 90,
  'Bob': 80,
  'Charlie': 85,
};

for (var entry in scores.entries) {
  print('${entry.key} のスコア: ${entry.value}');
}


// while 
int i = 0;
while (i < 5) {
  print('繰り返し $i');
  i++;
}


// do - while
int i = 0;
do {
  print('繰り返し $i');
  i++;
} while (i < 5);

まとめ

DartはTypeScriptと似ているので、TypeScript経験者なら学習コストかからずに習得できそうです。