난이도: 입문
1-자바스크립트 코드 실행 과정 평가(Evaluation)→실행(Execution)→값→렌더링 console.log(name); var name = "John"; function greet() { return "Hello " + name; } let message = greet(); 1-1-[평가 (Evaluation)] 변수, 함수(호이스팅) 등록 → 자바스크립트 엔진이 실행 전에 코드를 쭉 훑어보고,변수와 함수 정보를 메모리에 미리 등록합니다. 종류 이름 초기값 등록 위치 변수 name undefined 전역 변수 message 초기화 안 됨 … 더 읽기
1️⃣ 클라이언트와 서버 🔗MDN HTTP 1. 네트워크 개요 💼 네이버에 접속하면 뉴스와 쇼핑, 이메일등의 각종 편의 서비스를 이용할수 이유는 내 컴퓨터나 휴대폰이 네이버 회사의 컴퓨터와 네트워크로 연결되어 있기 때문이다 2. 클라이언트와 서버 네트워크로 연결된 컴퓨터는 크게 두개로 나눌수 있다. 정보를 요청해서 받는 ⇒ 클라이언트(Client) 정보를 제공해 주는 ⇒ 서버(Server) 보통 우리가 사용하는 웹, 앱은 클라이언트이고, … 더 읽기
🔗모듈학습 🔗MDN모듈문서 📢 프로그래밍에서 모듈 이란 export,default ✏️module.html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>modules</h1> <button>say</button> <script> document.querySelector('button').addEventListener('click', () => { say("망고") }) function say(user) { alert(`'hello',${user}`) } </script> </body> </html> 일반 html 문서작성후 모듈화 한다 ✏️say.js /*export 를 변수나 함수 앞에 붙이면 외부 모듈에서 … 더 읽기
자바스크립트의 제너레이터(generator, 생성기)는 함수의 실행을 중간에 멈추고 원하는 시점에 다시 재개할 수 있는 특별한 함수이다. 일반 함수가 실행되면 끝까지 실행된 후 반환값을 전달하는 것과 달리, 제너레이터는 여러 번에 걸쳐 값을 나누어 산출한다. 이 기능을 통해 이터러블(iterable, 순회 가능한 객체)이자 이터레이터(iterator, 반복자) 객체를 손쉽게 생성할 수 있다. 1. 특징 제너레이터는 순회 가능한 이터레이터를 생성하여 반환하는 함수이다. … 더 읽기
구조 분해 할당 (Destructuring Assignment) 자바스크립트에서 배열이나 객체와 같은 복합 자료형에 저장된 데이터를 다룰 때는 개별 값에 접근하여 별도의 변수에 저장하는 작업이 빈번하게 발생한다. 구조 분해 할당(디스트럭처링 할당)은 배열의 요소나 객체의 속성을 분해하여 개별 변수에 직접 할당할 수 있도록 지원하는 자바스크립트 표현식이다. 이 문법을 활용하면 여러 줄에 걸쳐 작성하던 기존의 값 추출 과정을 간결한 한 … 더 읽기
자바스크립트에서 전개 연산자(스프레드 오퍼레이터: Spread Operator)는 데이터 구조를 효과적으로 복사하고 병합할 때 사용하는 핵심 문법이다. 마침표 세 개(…)로 표기하며, 배열이나 객체처럼 여러 값이 묶여 있는 대상을 개별 요소로 분리하여 다룰 수 있게 돕는다. 기존 데이터를 직접 변경하지 않고 새로운 불변 상태를 생성할 수 있어 데이터 관리의 안정성을 높인다. 전개 연산자의 개념 전개 연산자는 반복 가능한(이터러블: … 더 읽기
완성화면 1. 달력만들기 당해 년도 달력을 만들어보자. 날짜 정보는 자바스크립트의 Date 객체를 활용하여 계산하고 표시한다. 1.1. 구조작성 1.1.1. html fontawasome cdn <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css'> <div class="container"> <div class="calendar"> <div class="month"> <i class="fas fa-angle-left prev"></i> <div class="date"> <h1></h1> <p></p> </div> <i class="fas fa-angle-right next"></i> </div> <div class="weekdays"> <div>일</div> <div>월</div> <div>화</div> <div>수</div> <div>목</div> <div>금</div> <div>토</div> </div> <div … 더 읽기
자바스크립트의 reduce() 함수는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환하는 강력한 배열 메서드입니다. 기본 구문 arr.reduce((accumulator, currentValue, currentIndex, array) => { // 리듀서 함수 로직 }, initialValue) 기본적인 숫자 합계 계산: const numbers = [1, 2, 3, 4, 5]; const sum = numbers.reduce((acc, current) => acc + current, 0); console.log(sum); // … 더 읽기
1-프로그래밍이란 1-1-정의 인간이 컴퓨터에게 일을 시키기 위해 요청하는 소통방법. 1-2-요건 내가 하고싶은 일을 명확히 정리하고 해결방안을 정의하는 능력필요 (문제해결능력 ≠ 알고리즘) 1-3-수행절차 문제(요구사항)의 명확한 이해 단순화 작업단위 분해(decomposition) 자료정리 구분(modeling) 절차에 맞게 행위배열 컴퓨팅적 사고란?(computational thinking) ”조금 더 크게하라” 는 지시는 인간적 사고로 컴퓨터는 알아듣지 못한다. 조금 더 크게 라는 것은 관념적인 개념으로 컴퓨터에게는 부적절한 … 더 읽기
