front end 22

[Dart 입문] 람다(lambda)

익명 함수(Anonymous function)와 람다 함수는 둘다 함수 이름이 없습니다. 익명함수에서 { }를 빼고 => 를 추가한 것이 람다 함수입니다. 단, 람다 함수는 { }가 없기 때문에 함수 로직을 수행하는 statement가 하나이어야 합니다(한 줄이 아닌, 명령 단위가 하나). void main() { List numbers = [1,2,3]; int sum = numbers.reduce((value, element) => value + element); print(sum); }

[Dart 입문] 함수 사용방법

1. 기본 int addNumbers(int a, int b) { return a + b; } void main() { // 실행결과: 3 print(addNumbers(1, 2)); } 2. object를 변수로 지정(네임드 파라미터) 여기서 required는 매개변수가 null값이 불가능한 타입이면 기본값을 지정하거나 필수로 입력해야 한다는 의미입니다. int addNumbers({ required int a, required int b }) { return a + b; } void main() { print(addNumbers(a: 1, b: 2)); } 3. 기본 값을 갖는 매개변수 [ ] 기호를 사용하여 매개변수의 값이 없을 경우 기본 값을 지정할 수 있습니다. int addNumbers(int..

[Dart 입문] null 관련 연산자

Dart에서는 변수가 null을 가지는지 여부를 직접 지정해야 합니다. int, double과 같이 자료형을 그대로 사용하면 null을 저장할 수 없습니다. 자료형 뒤에 물음표(?)를 추가해야 null을 저장할 수 있습니다. 아래와 같이 사용하면 에러가 발생합니다. void main() { double number1; print(number1); } 다음과 같이 사용할 수 있습니다. void main() { // 초기값 null double? number; print(number); // ??을 사용하면 기존 값이 null일 때만 저장 number ??= 3; print(number); // 따라서 4는 저장되지 않음 number ??= 4; print(number); }

Dart 입문. Collection(List, Map, Set)

Collection은 여러 값을 하나의 변수에 저장할 수 있는 타입니다. Collection은 서로의 타입으로 자유롭게 형변환이 가능하다는 큰 장점이 있습니다. 1. List 리스트(List)는 여러 값을 순서대로 한 변수에 저장할 때 사용됩니다. 리스트의 구성단위를 원소라고 합니다. 리스트명[index] 형식으로 특정 원소에 접근할 수 있습니다. 첫 번째 원소는 index 0이며, 마지막 원소는 리스트의 길이 -1입니다. void main() { List list = ['홍길동', '임꺽정', '강감찬', '이순신']; print(list); // 리스트 전체 출력 print(list[0]); print(list[3]); // 마지막 원소 지정 print(list.length); // 리스트의 길이 p..

Dart 입문. 기초 문법

1. 메인 함수 dart는 프로그램 시작점인 엔트리 함수 기호로 main()을 사용합니다. main 뒤에 있는 괄호 안에 입력받을 매개변수를 지정할 수 있습니다. void main() { } 2. 주석 주석은 javascript에서 사용하는 //와 /* */를 동일하게 사용합니다. 3. print() 함수 print() 함수는 문자열을 콘솔에 출력하는 함수입니다. void main() { print('Hello World'); } 4. dynamic을 사용한 변수 선언 var 타입은 변수의 값을 사용해서 변수의 타입을 유추하는 키워드입니다. 타입을 한번 유추하면 추론된 타입이 고정됩니다. 따라서 변수 타입이 다른 값을 저장하려고 하면 에러가 발생합니다. 하지만 dynamic 키워드를 사용하면 변수의 타입..

Dart 입문. Dart 소개

Dart는 2011년 공개된 프로그래밍 언어이지만 2018년 배울 필요 없는 언어 1위에 랭크되기도 했습니다. 하지만 Flutter가 Dart로 구현되며 Flutter를 공부하려면 Dart 먼저 공부해야 하는 상황이 되었습니다. 그런데 왜 Flutter는 왜 Dart로 구현되었을까요? 여러 가지 설이 있지만, Flutter의 코어 개발자가 Dart언어의 코어개발자 이기 때문이었다는 설이 가장 설득력 있는 것 같습니다. Dart 소개 Dart는 구글이 개발한 프로그래밍 언어로써, 2011년 10월 GOTO 콘퍼런스에서 공개되었습니다. 구글은 크롬에 Dart 가상 머신(virtual machine)을 심어 자바스크립트를 대체하려는 시도를 했지만 웹 개발에 혼란을 가져온다는 여론을 극복하지 못하고 결국 Dar..

Flutter 설치 및 개발환경 구축 (Windows, Mac)

1. Windows 개발 환경 구축 1.1. Flutter SDK 설치 for Wnidows 1.1.1. Flutter 다운로드 1.1.1.1. Flutter 홈페이지에 접속해 [Windows]를 클릭합니다. 1.1.1.2. 'Get the Flutter SDK'의 [flutter_windows_{버전}.zip] 버튼을 클릭합니다. 1.1.1.3. 다운로드한 압축파일을 원하는 위치에 풀어줍니다. 저는 C:/flutter에 압축을 풀었습니다. 1.1.2. 환경 변수 설정 Flutter SDK를 사용해서 모든 Flutter 명령을 실행하려면 Windows에 Flutter SDK 위치를 등록해야 합니다. 이 과정을 '환경 변수 설정'이라고 부릅니다. 1.1.2.1.Wndows 검색창에 '환경'이라고 검색 후,..

javascript jsdoc에서 일반 변수가 아닌 json object를 표현하는 방법

프로그래밍에서 주석은 정말 중요합니다. 주석을 잘 써놓으면 정말 도움이 많이 됩니다. 오픈소스 라이브러리를 사용할 때나, 다른 사람과의 협업에서도 주석을 보며 일을 합니다. /** * 숫자를 더한다. * @param number1 숫자 1 * @param number2 숫자 2 * @returns {*} 숫자1 + 숫자 2 */ function plus(number1, number2) { return number1 + number2; } 이런 코드와 주석이 있다면 이 함수를 사용하는 부분에서 아래처럼 표시가 됩니다. object 형태의 파라미터(매개변수)를 표현하는 방법은 여러 가지가 있습니다. 방법 1. /** * 두개의 숫자를 더한다. * @param json * @param json.number1 ..

CSS에 hyphen(-)을 사용해야 하는 이유

CSS는 이미 hyphen을 사용하고 있습니다. margin-left, padding-top, font-size 등 이미 CSS는 hyphen으로 되어있습니다. jQuery 또한 모두 hyphen으로 되어있습니다. 가독성이 더 좋습니다. navHome -> nav-home marginLeft -> margin-left paddingTop -> padding-top hyphen을 사용하면 CSS에서 제공하는 selector를 사용할 수 있습니다. CSS2 파이프 패턴: [class|="col"] 다른 selector는 여기 CSS3 star 패턴: [css*="col-"] 다른 selector는 여기 reference http://jasonbuckboyer.com/playground/use-hyphens-..

front end 2022.10.17

javascript에서 브라우저 종류 확인하는 방법

const agent = window.navigator.userAgent.toLowerCase(); let browserName; if(agent.indexOf("edge") > -1) { browserName = "MS Edge"; // 예전 MS edge } else if(agent.indexOf("edg/") > -1) { browserName = "크로미움 기반 Edge"; } else if(agent.indexOf("opr") > -1 && !!window.opr) { browserName = "Opera"; // 오페라 } else if(agent.indexOf("chrome") > -1 && !!window.chrome) { browserName = "chrome"; // 크롬 } else ..

728x90
loading