31일차 :: 스나이퍼팩토리 내개인블로그

카테고리 없음 2023. 3. 10. 10:47

외부에서 접근을 할 수 없도록, Private하게 사용할 수 있는 멤버 변수(또는 멤버 함수 등)를 지정하는 방법이 있다. Dart에서는 Private 멤버 변수를 어떻게 설정하는지 알아보고 정리하시오.
- 이때, Private으로 멤버변수를 설정시 얻는 이점에 대해서도 추가적으로 고민하여 정리하시오.

Private 변수

Dart에서는 변수명 앞에 _(underscore)를 추가함으로써, Private 변수를 생성할 수 있다. 클래스안에서만 Private 변수가 사용 가능한 다른 언어와는 달리, Dart에서는 클래스가 정의된 파일에서는 Private 변수에 접근할 수 있다.

예를들어,

class Idol{
  //Private 변수 선언
  String _name;
    
  Idol(this._name);
}
void main(){
  Idol blackPink = Idol('블랙핑크);
  print(blackPink._name);
}

결과

블랙핑크

Private으로 멤버변수를 설정시 얻는 이점은 프로젝트를 진행할 때, 나홀로 진행하는 것이라면 상관없지만 다수가 함께 참여하여 진행하는 프로젝트의 경우 해당 자료를 보호할 수 있도록 private 멤버 변수를 사용하는것이 좋다.

2. 클래스에서는 부모의 힘과 기능을 사용할 수있도록 extends가 존재한다. extends를 사용하게되면 super의 키워드도 간혹볼 수 있는데, 이 때 super의 기능은 무엇인지 정리하시오.

extends

extends는 클래스의 자식 클래스를 생성할때 사용한다.

기본형태

class 부모클래스 {
	constructor(변수1,변수2){
		this.변수1 = 변수1;
        this.변수2 = 변수2;
    }
    메소드(){
    	//기능
        ...
    }
}

class 자식클래스 extends 부모클래스 {
	constructor(변수1, 변수2, 변수3){
    	//super키워드로 부모클래스 생성자 호출
    	super(변수1,변수2);
        this.변수3 = 변수3;
    }
    메소드2(){
    	//부모 클래스의 메소드 호출
    	super.메소드();
        //추가할 자식 클래스만의 기능
        ...
    }
}

샘플예제

//부모 클래스
class Score {
    constructor(math,english,korean){
        this.math = math;
        this.english = english;
        this.korean = korean;
    }

    sum() {
        return this.math + this.english + this.korean;
    }

    avg(){
        const sum = this.sum();
        console.log('평균 점수 (3과목) : '+ sum / 3);
    }
}

//자식 클래스
class Student extends Score {
    constructor(math,english,korean,science){
    	//super키워드를 통해 부모 클래스 생성자 호출
        super(math,english,korean);
        //추가 프로퍼티 초기화
        this.science = science;
    }

    avg(){
    	//super.sum()을 통해 부모 클래스의 
        //메소드 접근
        const sum = super.sum() + this.science;
        console.log('평균 점수 (4과목): '+ sum / 4);
    }
}

const stu = new Student(90,90,100,100);
stu.avg();

실행결과

평균 점수 (4과목): 95

super()은 부모 생성자를 호출한다.

부모 생성자의 일이 끝난 후 부모가 해결하지 못하는 것은 자식 생성자가 하도록 하는 것이다.

이 super()이 없다면 중복이 될 것을 부모에게 가서 실행시키고 오는것이다.

Score라는 클래스를 사용 하면서 거기서 더 부가적인 기능을 추가해서 이용하고 싶을 때 extends, 상속을 이용한다.

물론 Score 클래스에서 다른 메소드를 넣을 수 있으나, 만일 저 코드가 내 코드가 아니거나 수정하면 참 곤란해지는 것 이라면, 신경쓸게 많아질 것이다.

때문에 어차피 겹치게 될 Score의 생성자를 상속받고 나머지는 자식인 Student의 sum,avg만 호출하여 결국 자식의 콘솔로그만 출력이 되는 것이다.

3. GetPage의 URL방식 네비게이션을 활용한 페이지 접근은 원하는 데이터를 포함시키어 다음 페이지로 이동시킬 수 있다. 다음의 결과물은 이 전 페이지(MainPage)에서 Get.toNamed를 활용하여 DetailPage로 이동된 결과다.

lib/page/detail_page.dart (코드보기)

import 'package:flutter/material.dart';
import 'package:get/get.dart';

class DetailPage extends StatelessWidget {
  const DetailPage({super.key});
  static const String route = '/detail';

  @override
  Widget build(BuildContext context) {
    var params = Get.parameters;
    var arguments = Get.arguments;
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('$params'),
            Text('$arguments'),
          ],
        ),
      ),
    );
  }
}

Get.Parameter가 무엇을 의미하는지, Get.toNamed를 활용하여 Parameter를 넘길 수 있는 방법에 대해 연구하고 코드를 제시하시오.

사용법

Get.toNamed('/papa/value');

value 값이 param 값으로 전달된다.

ex)

Get.toNamed('/papa/1234');

1234가 param 값으로 전달,

param값을 받으려면

Get.parameters['param']

마찬가지로 쿼리도 다음과 같은 방식으로 사용할 수 있다.

Get.toNamed('/papa/value?id=123&name=침착맨');

받는 방법은
Get.parameters['param'] => value 값
Get.parameters['id'] => id 값, 즉 123
Get.parameters['name'] => name 값, 즉 침착맨이다

Get.arguments가 무엇을 의미하는지, Get.toNamed를 활용하여 arguments를 넘길 수 있는 방법에 대해 연구하고 코드를 제시하시오.

페이지 이동 시 argument를 전달해야 하는 상황을 구현한 코드

//방법1
 Get.toNamed('/next', arguments: 'Hello');

//방법2 맵 방식을 보냅니다. 
Get.toNamed('/next', arguments: {'name': '제로', 'age': '31'});

//방법3. custom하게 만든 객체도 보냅니다.
Get.toNamed('/next', arguments: User(name: '제로', age: 35));

class User {
  String name;
  int age;
  User({required this.name, required this.age});
}

전달되는 argument를 화면에 출력

// 방법1: 전달받은 argument를 변수에 담습니다. 
var arg = Get.arguments;

// 방법 2: 전달받은 argument를 바로 ui 화면에 표시합니다.
Text('${Get.arguments}'),

// 방법3: 여러 arguments가 담겨있는 경우 아래처럼 화면에 표시합니다. 
Text('이름 : ${Get.arguments['name']}  나이 : ${Get.arguments['age']}'),

//방법 3: 여러 arguments가 담겨있는 경우 아래처럼 화면에 표시합니다.2 
Text('이름 : ${(Get.arguments as User).name}  나이 : ${(Get.arguments as User).age}'),

-----------------------------------------------------------------------------------------------------------------------------------------------------------------

lib/util/pages.dart

import 'package:myapp31/page/detail_page.dart';
import 'package:myapp31/page/main_page.dart';
import 'package:myapp31/util/routes.dart';

class AppPages {
  static final pages = [
    GetPage(name: AppRoutes.detail, page: () => DetailPage()),
    GetPage(name: AppRoutes.main, page: () => MainPage()),
  ];
}

lib/util/routes.dart

import 'package:myapp31/page/detail_page.dart';
import 'package:myapp31/page/main_page.dart';

class AppRoutes {
  static const detail = DetailPage.route;
  static const main = MainPage.route;
}

main.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:myapp31/page/main_page.dart';
import 'package:myapp31/util/pages.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      getPages: AppPages.pages,
      home: MainPage(),
    );
  }
}

lib/page/main_page.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:myapp31/util/routes.dart';

class MainPage extends StatelessWidget {
  const MainPage({super.key});
  static const String route = '/main';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
            onPressed: () => Get.toNamed('${AppRoutes.detail}/value?a=3',
                arguments: 'Hello World'),
            child: Text('DetailPage 이동')),
      ),
    );
  }
}

lib/page/detail_page.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';

class DetailPage extends StatelessWidget {
  const DetailPage({super.key});
  static const String route = '/detail';

  @override
  Widget build(BuildContext context) {
    var params = Get.parameters;
    var arguments = Get.arguments;
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('$params'),
            Text('$arguments'),
          ],
        ),
      ),
    );
  }
}

[참고]

https://zzingonglog.tistory.com/33

https://rypro.tistory.com/134

https://goodmemory.tistory.com/121

https://jae04099.tistory.com/entry/JavaScript-%EC%83%81%EC%86%8D-extends-super

https://velog.io/@chjo0330/Flutter-GetX%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%9C-Navigation%ED%8E%98%EC%9D%B4%EC%A7%80-%EC%9D%B4%EB%8F%99

ABOUT ME

스나이퍼팩토리 내개인블로그 스나이퍼팩토리 내개인블로그

Private 변수

extends

티스토리툴바