Front-end 개발/한입챌린지
-
[한입챌린지] 6일차 - JS 배열 메서드, Date 객체Front-end 개발/한입챌린지 2024. 3. 31. 00:01
배열 메서드 배열 요소 조작 - 배열 타입 자체가 실무에서 굉장히 요긴하게 사용되는 타입이다. - 그렇기 때문에 배열을 다루는 배열 메서드들도 정말 많은 곳에서 활용되기 때문에 매우 중요하다. - 배열 요소를 조작하는 6가지 메서드를 알아본다. (1) push - 배열의 맨 뒤에 새로운 요소를 추가하는 메서드이다. - 만약 여러 개의 요소를 동시에 추가하고 싶다면 쉼표로 구분해서 추가해주면 된다. - push 메서드는 요소 추가를 수행하고 난 뒤 변환된 배열의 길이를 반환한다. // 6가지 요소 조작 메서드 // 1. push // 배열의 맨 뒤에 새로운 요소를 추가하는 메서드 let arr1 = [1,2,3]; arr1.push(4); console.log(arr1); // 1 2 3 4 const n..
-
[한입챌린지] 4일차 - JS 단락평가, truthy, falsyFront-end 개발/한입챌린지 2024. 3. 29. 18:41
Truthy와 Falsy - JavaScript에서는 참, 거짓이 아닌 값도 참, 거짓으로 평가한다. - 어떤 값이 참이나 거짓을 의미하는 값이 아닌데도, 조건문 내에서 참이나 거짓으로 평가하는 JavaScript의 특징을 지칭할 때 Truthy, Falsy라고 부른다. - 아래 if 문의 조건식에 있는 123이란 숫자 값처럼 참은 아니지만 조건문 내에서 참으로 평가되는 이러한 값들을 Truthy(트루시), 즉 참 같은 값이라고 표현한다. - 반대로 아래 코드 if 문의 조건식에 있는 undefined 처럼 거짓은 아니지만 조건문 내에서는 거짓으로 평가되는 이런 값들을 Falsy한 값, 즉 거짓 같은 값이라고 표현한다. - JavaScript에 존재하는 모든 값은 Truthy하거나 Falsy 하다. 이런..
-
[한입챌린지] 4일차 - JS 객체, 배열, 단락평가Front-end 개발/한입챌린지 2024. 3. 29. 16:40
객체 원시 타입이 아닌 객체 타입이며, 여러가지 값을 동시에 저장할 수 있는 자료형을 의미한다. 객체를 이용하면 현실 세계에 존재하는 어떤 삼루이나 개념을 표현하기 용이함 객체의 생성과 프로퍼티 - JavaScript에서는 객체를 두 가지 방식으로 생성할 수 있다. - 첫번째 방법은 객체 생성자라고 불리는 new Object() 내장함수를 이용하는 방식이고, 두번째 방법은 빈 중괄호를 하나 열어서 객체를 생성해주는 객체 리터럴 방식이다. 두가지 방식 모두 동일한 객체를 생성한다. 객체 리터럴 방식이 훨씬 더 간겨하기 때문에 대부분은 이 방식을 사용한다. - 객체를 작성하는 방법은 key-value 쌍을 콤마(,)로 구분해서 중괄호 안에 작성한다. 이때 key-value 쌍들을 객체의 프로퍼티라고 부르며,..
-
[한입챌린지] 2일차 - JS 조건문과 반복문Front-end 개발/한입챌린지 2024. 3. 26. 19:51
자바스크립트의 조건문 if 문 (if 조건문) - 조건문이란 특정 조건을 만족했을 때에만 실행되는 코드를 작성하기 위한 문법 - 대표적으로 if, switch 조건문이 존재함 - 문법은 먼저 if 키워드를 써주고, 이어서 조건식을 써줄 소괄호와 조건식이 만족했을 때 실행할 코드가 들어가는 중괄호를 써준다. - 중괄호 안에는 여러줄의 코드를 작성할 수도 있다. - 조건식의 결과가 거짓으로 조건을 만족하지 않으면, 중괄호 안의 코드가 실행되지 않는다. - if문의 조건식을 만족하지 않았을 때 수행하고 싶은 코드가 있는 경우 (조건식의 결과가 거짓일 때) if 문 아래 else문의 중괄호를 열어서 코드를 추가할 수 있다. - else의 의미는 '그렇지 않으면' 이며, 전체적인 의미를 표현하면 'if 조건문이 ..
-
[한입챌린지] 2일차 - JS 형변환과 연산자Front-end 개발/한입챌린지 2024. 3. 26. 17:56
JavaScript의 형 변환(Type Casting) - 어떤 값의 타입을 다른 타입으로 변경하는 것을 말함 - 형 변환은 묵시적 형 변환(암묵적 형변환)과 명시적 형 변환으로 두가지 형태가 있음 - 묵시적 형 변환은 개발자가 직접 설정하지 않아도 알아서 JavaScript 엔진이 형 변환 하는 것을 말함 - 명시적 형 변환은 개발자가 직접 함수 등을 이용해 형 변환을 일으킴 묵시적 형 변환 - JavaScript 엔진은 최대한 Error를 통해서 프로그램이 멈추는 것을 방지하기 위해 묵시적 형 변환을 수행함 - 하지만 모든 불가능한 연산에 대해서 항상 묵시적 형 변환이 수행되는 것은 아니라 특정 하나의 변수의 값을 형변환 했을 때 오류가 발생하지 않고 연산이 잘 종료될 수 있는 경우에만 묵시적 형 변..
-
[한입챌린지] 1일차 - JS 변수와 자료형Front-end 개발/한입챌린지 2024. 3. 25. 18:22
변수와 상수 변수, 상수는 값을 저장하는 박스 변수 선언 및 초기화 - 변수는 프로그래밍을 하면서 값을 바꿔가며 사용할 수 있는 변수 - 같은 이름의 변수를 선언하면 Error 가 발생한다. // 1. 변수 let age = 27; // let age; (초기화) let age = 27; (초기화 및 할당) console.log(age); // 27 age = 30; 상수 선언 및 초기화 - 상수는 변수와 달리 한번 저장된 값을 다시는 변경할 수 없다. - 상수는 let 대신에 const 라는 키워드를 사용한다. - 상수는 변할 수 없거나, 변해서는 안되는 값을 저장할 때 변수 대신에 자주 사용한다. - 상수는 선언 이후에는 값을 변경하는 것이 불가능하기 때문에 반드시 초기화가 필요하다. - 변수와 상수..
-
[한입챌린지] 1일차 - JavaScript와 VSCode 환경설정Front-end 개발/한입챌린지 2024. 3. 24. 21:17
JavaScript 기초 개념 JavaScript(JS)는 무슨 역할을 하는 언어일까? - Web 페이지를 개발하기 위해 만들어진 언어 (JS, HTML, CSS) - 현재는 웹 서버, 데스크탑 어플리케이션, 모바일 어플리케이션, 기타 등등 넓어졌다. JavaScript는 어떻게 실행할까? - 웹 브라우저에 있는 JavaScrip 엔진을 통해 직접 실행해 볼 수 있다. GitHub 저장소 생성 새로운 github 저장소를 만들고 로컬 폴더와 연동하기 - REAMD.md 파일도 생성하도록 설정했으면 git clone 명령어로 쉽게 끝나는데.. 체크하는 걸 깜빡했다. - GitHub에서 알려준 대로 첫번째 코드블럭에 있는 예제를, VSCode 터미널에서 따라한다. VSCode 환경 설정 VSCode 확장 프..