본문 바로가기

Frontend Dev

(147)
Section1 Unit9 과제 JavaScript Koans Section1 Unit9 [JavaScript] JavaScript Koans ⭐️ 과제. JavaScript Koans 이번 유닛의 JavaScript Koans 과제를 진행하며, 자바스크립트의 기본 개념을 정리할 수 있었다. Javascript Koans는 1번 소개 챕터를 제외하고, 10번까지 9개의 챕터로 나눈 파일이 제공되었다. (타입, 변수, 스코프, 함수, 배열, 객체, 스프레드 문법 등) 헷갈렸던 부분들은 따로 정리하고, 문제도 최대한 다 이해하려 했다. 이번 TIL에서는 헷갈렸던 개념이랑 문제들, 따로 찾아보기를 권고했던 사항 중에 내가 잘 몰랐던 부분들을 위주로 정리를 해볼까 한다 🙂 • 03_LetConst.js Q. 재할당도 안되는 'const' 키워드를 굳이 써야하는지 이해가 안..
Section1 Unit9 JavaScript 핵심 개념과 주요 문법 - ES6 신규 문법 Section1 Unit9 [JavaScript] 핵심 개념과 주요 문법 - ES6 신규 문법 📌 Chapter4. ES6 신규 문법 이번 유닛에서 학습한 내용들은 아래와 같은 ES6 신규 문법이었다. 다른 문법은 노션에 정리해두고, 자주 사용했던 화살표 함수는 블로그에도 따로 정리를 해보았다 🙂 • spread 문법과 rest 문법 • 구조분해할당 • 화살표 함수 자바스크립트 ES6 화살표 함수 기본 화살표 함수란 함수 표현식보다 단순하고 간결한 문법으로 함수를 만들 수 있는 방법으로, 화살표 함수라는 이름은 문법의 생김새를 차용해 지어졌다. // 화살표 함수 let func = (arg1, arg2, ...argN) => fay-story.com ⭐️ 과제. JavaScript Koans 이번 과제로..
Section1 Unit9 JavaScript 핵심 개념과 주요 문법 - 자료형, 스코프, 클로저 Section1 Unit9 [JavaScript] 핵심 개념과 주요 문법 - 자료형, 스코프, 클로저 📌 Chapter1. 원시 자료형과 참조 자료형 • 원시 자료형(primitive data type) : number, string, boolean, undefined, null → 데이터를 복사 때 데이터값이 복사되기 때문에 기존의 데이터에 영향이 가지 않는다. • 참조 자료형(reference data type) : array, object, function → 데이터 복사 시 주소를 복사하기 때문에 기존의 데이터에도 영향이 간다. 📌 Chapter2. 스코프 • 스코프(scope)는 변수와 함수가 유효한 범위를 결정하는 규칙이다. 스코프는 변수와 함수가 언제, 어디서, 어떻게 사용 가능한지를 정의한..
Section1 Unit8 JavaScript 객체 Section1 Unit8 [JavaScript] 배열, 객체 - 객체 📌 Chapter2. 객체 • 객체란 이름(name)과 값(value)으로 구성된 프로퍼티(property)의 정렬되지 않은 집합. let user = { fristName: "Haily", lastName: "Lee", city: "Seoul" }; // 객체표기법 user.firstName // Haily → Dot notation user["city"] // Seoul → Bracket notation → 객체는 키(key)와 값(value)으로 이루어지며, 키와 값 사이는 콜론(:)으로 구분한다. → 중괄호를 이용해서 객체를 만들고, 키과 값은 쉼표로 구분한다. ⬇︎ 키 값이 동적으로 변할 때는(ex. 변수일때) Bracket..
Section1 Unit8 JavaScript 배열 Section1 Unit8 [JavaScript] 배열, 객체 - 배열 📌 Chapter1. 배열 • 배열은 이름과 인덱스로 참조되는 정렬된 값의 집합으로, 하나의 변수에 여러 개의 데이터를 저장할 수 있다. 배열을 구성하는 각각의 값을 배열 요소(element)라고 하며, 배열에서의 위치를 가리키는 숫자를 인덱스(index)라고 한다. // 배열 선언 let myNumber = [7, 45, 34, 123, 3]; // 배열 조회 myNumber[3] // 123 값을 조회. myNumber[3] = 200; // 값을 변경 myNumber[5] // undefined myNumber.length // 5 • console.table() 표 형식의 데이터를 테이블로 표시한다. → 이렇게 출력할 수 있는..
Section1 Unit7 Linux, Git 기초 Section1 Unit7 [Linux/Git] 기초 📌 Chapter1. Command-Line Interface • 터미널(Terminal)은 입력하는 글자와 출력되는 글자로 컴퓨터와 소통할 수 있는 CLI(Command-Line Interface) CLI로 생성한 폴더나 파일은 GUI로 확인할 수 있고, GUI로 작업한 내용도 CLI에서 확인할 수 있다. • Terminal에서 사용할 수 있는 기본적인 명령어들도 학습했다. 평소에 헷갈렸던 부분들이 많았는데, 이번 수업으로 정리를 할 수 있었다. 노션에 따로 정리는 해 두었는데, 시간나면 따로 블로그에 게시글로 쓰면 좋을듯 하다 :) 라이브 세션에서의 수업도 알차고, 재미있었다 👍🏻 • 우리는 서비스의 소비자가 아니라 공급자이기 때문에 컴퓨터에 대해..
자바스크립트 반환(return)문 사용하기 👾 반환(ruturn)문이란? 자바스크립트에서는 함수를 호출했을 때 함수를 호출한 곳에 특정 값을 반환하게 할 수 있는데, 이 특정 값을 반환 값(return value)이라고 한다. 반환값을 통해 함수에서 실행된 결과를 전달받을 수 있다. function sum(x, y) { return x + y; // 반환문 } let result = sum(1, 2); console.log(result) // 3 → return문의 결과는 함수 외부로 반환되고, 함수 외부에서 함수의 실행결과를 확인할 수 있다. 👩🏻‍💻 example function examPass(name, html, css, js){ let comment = name + '학생은 '; if (html >= 60 && css >= 60 && j..
함수 정의 방식 : 함수 선언문(function declaration)과 함수 표현식(function expression) 자바스크립트에서 함수를 정의하는 방식은 크게 함수선언문(function declaration)과 함수 표현식(function expression)으로 나눌 수 있다. ✏️ 전체 글을 공부하기에 앞서 요약하자면, 함수 선언문(function declaration)은 함수 이름과 함수 내용을 포함하는 방식으로 함수를 정의한다. 이 방식은 코드 어디에서든 호출할 수 있으며, 호이스팅(hoisting)이라는 개념에 따라 함수 선언문을 나중에 작성해도 코드 상단으로 이동하여 먼저 실행된다. 함수 표현식(function expression)은 변수에 함수를 할당하는 방식으로 함수를 정의한다. 이 방식은 변수에 할당된 함수를 호출하는 방식으로만 사용할 수 있다. 함수 표현식은 변수에 값을 할당하는 것과 동일하게 처리..

반응형