-
[Flutter] 플러터 2.0 null safety 를 이해해보자웹 개발/Flutter 2021. 8. 4. 22:46반응형
Null safety를 이해 해보자
flutter가 2.0 버전으로 업데이트 되면서 dart 언어에 null safety가 적용되었다.
null safety가 null을 사용하지 못하게 하는 것이라 오해할 수도 있는데 (왜냐하면 내가 그랬다 ㅎ..),
null로 인한 런타임 에러를 방지해 개발자의 생산성을 높이고자 하는 목적이 있다.
자세히 말하면, null safety는 변수가 null을 허용하는지 구분하기 위한 개념인데 기본적으로 null을 허용하지 않는다.
dart 언어는 null safety를 지원하지 않았기 때문에
변수 값이 초기화 되지 않았거나 null 값을 전달하면 컴파일 에러는 발생하지 않고 런타임 과정에서 오류가 발생했다.
이러한 이유로 코드를 작성할 땐 오류가 발생할 것을 예상하지 못하기 때문에 코드를 수정하고 다시 빌드하기까지의 개발 시간이 추가된다.
이를 해결하기 위해 null safety를 적용하여
개발자가 런타임 과정이 아닌 코드를 편집하는 과정에서 IDE로 부터 빠른 피드백을 받도록 하였다.
첫 번째 그림처럼, 기존 null safety를 적용하기 전에는 null이 모든 유형의 하위유형으로 취급되었다.
이런 이유로 여러 자료형들이 null 값을 가질 수 있지만
여러 메서드가 정의되어 있는 다른 자료형과 달리 null는 메서드가 정의되지 않다.
따라서 상위 자료형에 null값이 대입되고 메서드를 적용하려 하면, null은 상위 자료형이 가진 메서드가 없기 때문에 런타임 에러가 발생하는 것이다.
두 번째 그림이 null safety가 적용된 Non-nullable 타입 구조이다.
Non-nullable에서는 null 자료형을 분리하여 다른 자료형들의 null을 허용하지 않는다.
하지만 자료형 뒤에 ?를 붙여 null 값을 허용하는 nullable 자료형을 제공하기 때문에 첫 번째 사진의 오류를 방지한다.
Null safety를 적용해보자
1) 버전 확인
Null safety는 Dart 2.12과 Flutter 2. 버전 부터 가능하다.
dart --version
2) flutter를 stable 버전으로 업그레이드 한다.
flutter channel stable
flutter update
Null safety 문법
1) null 값을 사용하고 싶으면 자료형 뒤에 ?를 붙힌다.String? notAString = null; print(notAString?.length.isEven);
2) null이 들어가지 않는다고 확실히 말하고 싶다면 ! 키워드를 붙여준다
color? 형식의 BorderSide color에, null이 아닌 Color 자료형의 값을 넣어주니
Color? 자료형은 Color를 assign할 수 없다는 에러가 났다.
border 라이브러리 코드에서 color가 null이 아닐 때만 this.color를 내보내기 때문에 에러가 나는듯 하다.
null값이 들어가지 않다고 확실하게 말해주는 '!' 키워드를 붙여주니 해결되었다.//null safety 해결 BorderSide( width: 1, color: ColorPalette.primaryColor[400]!, );
//border 라이브러리 BorderSide copyWith({ Color? color, double? width, BorderStyle? style, }) { assert(width == null || width >= 0.0); return BorderSide( color: color ?? this.color, width: width ?? this.width, style: style ?? this.style, ); }
null safety 문법에 대한 이해는 양이 많으니 아래의 다큐먼트를 참고하자!
https://dart.dev/null-safety/understanding-null-safety반응형'웹 개발 > Flutter' 카테고리의 다른 글
[Flutter] flutter 2.0 stable 버전 출시에 대해 알아보자 (0) 2021.05.03 [Flutter] After Effects로 작업한 애니메이션을 flutter에 적용하는 방법 (Lottie) (0) 2021.02.17 [Flutter Web] Fluro 패키지로 네비게이션 라우팅하기 ( Deep link / Transitions) (1) 2021.02.11 [Web] 안드로이드 스튜디오에서 웹 실행시 포트 지정(설정) 하는 법 (0) 2021.02.07 [Flutter] Service locator pattern을 사용해 build context 없이 navigate 하기 (0) 2021.01.31