반응형

전체 글 542

#6 자바스크립트 조건문/반복문

- 조건문자바스크립트에서 조건문은 프로그램의 흐름을 제어하고 특정 조건에 따라 다른 코드를 실행하는 데 사용됩니다. 다양한 종류의 조건문이 있으며, 각 조건문은 고유한 용도와 문법을 가지고 있습니다.1. if 문가장 기본적인 조건문으로, 주어진 조건이 참일 때만 코드 블록을 실행합니다. let age = 20;if (age >= 19) { console.log("성인입니다.");}  2. if...else 문조건이 참일 때와 거짓일 때 각각 다른 코드 블록을 실행합니다. let isMember = false;if (isMember) { console.log("회원입니다.");} else { console.log("회원이 아닙니다.");}  3. if...else if...else 문여러 개의 조건을..

JS/JavaScript 2024.08.28

#5 자바스크립트 연산자

자바스크립트에서 연산자는 데이터를 처리하고 새로운 값을 생성하는 데 사용되는 특수한 기호입니다. 다양한 종류의 연산자가 있으며, 각 연산자는 고유한 기능과 우선순위를 가지고 있습니다. 이번 글에서는 자바스크립트 연산자에 대해 상세히 설명하고, 예제를 통해 이해를 돕겠습니다.1. 산술 연산자숫자 값을 가지고 사칙연산 등의 계산을 수행합니다.덧셈: + let result = 5 + 3; // result는 8  뺄셈: - let result = 10 - 4; // result는 6  곱셈: * let result = 2 * 5; // result는 10  나눗셈: / let result = 10 / 2; // result는 5  나머지: % let result = 10 % 3; // result는 1  증..

JS/JavaScript 2024.08.27

#4 자바스크립트 호이스팅(Hoisting)

자바스크립트 호이스팅이란 무엇일까요?자바스크립트의 호이스팅(Hoisting)은 변수나 함수 선언이 실제 코드에서 작성된 위치와 상관없이 코드의 맨 위로 끌어올려지는 것처럼 동작하는 특징을 말합니다. 즉, 변수나 함수를 선언하기 전에 사용하더라도 에러가 발생하지 않고, 선언된 것처럼 동작하는 현상을 의미합니다.왜 호이스팅이 발생할까요?자바스크립트 엔진은 코드를 실행하기 전에 먼저 코드 전체를 스캔하여 변수와 함수를 메모리에 할당합니다. 이 과정에서 변수와 함수 선언이 코드의 맨 위로 끌어올려지는 것처럼 보이는 효과가 발생하는 것입니다.호이스팅의 종류와 예제1. 변수 호이스팅var 키워드: var로 선언된 변수는 호이스팅이 되며, 선언 전에 사용하면 undefined 값을 가집니다.console.log(x)..

JS/JavaScript 2024.08.27

#3 자바스크립트 타입 변환

자바스크립트는 동적 타입 언어이기 때문에, 변수의 데이터 타입이 실행 중에 변경될 수 있습니다. 이러한 변환을 타입 변환이라고 합니다. 자바스크립트는 암시적 형 변환과 명시적 형 변환 두 가지 방식을 지원합니다.1. 암시적 형 변환 (Implicit Type Conversion)자바스크립트 엔진이 개발자가 의도하지 않더라도 자동으로 데이터 타입을 변환하는 것을 말합니다. 주로 연산 시에 발생하며, 예상치 못한 결과를 초래할 수 있으므로 주의해야 합니다.문자열 연결: 숫자와 문자열을 더하면 숫자가 문자열로 변환되어 연결됩니다.let result = 10 + "20"; // "1020"  비교 연산: 다른 타입의 값을 비교할 때, 자바스크립트는 값을 비슷한 타입으로 변환하여 비교합니다.console.log(..

JS/JavaScript 2024.08.27

#2 자바스크립트 데이터 타입 완벽 정복

자바스크립트에서 데이터 타입은 변수에 저장되는 값의 종류를 의미합니다. 데이터 타입을 정확하게 이해하는 것은 효율적인 자바스크립트 개발을 위해 필수적입니다. 이번 글에서는 자바스크립트에서 사용되는 다양한 데이터 타입에 대해 상세히 설명하고, 예제를 통해 이해를 돕겠습니다.1. 원시 타입 (Primitive Type)원시 타입은 값 자체가 메모리에 직접 저장되는 단순한 데이터 타입입니다.Number: 숫자를 나타냅니다. 정수, 소수, 부동소수점 숫자 등 다양한 숫자를 표현할 수 있습니다. let age = 30; // 정수let price = 9.99; // 소수let bigInt = 1234567890123456789n; // BigInt (큰 정수)  String: 문자열을 나타냅니다. 따옴표(')나 ..

JS/JavaScript 2024.08.27

#1 자바스크립트 변수 선언 : var, let, const 차이점 완벽 정리

자바스크립트에서 변수를 선언하는 방법은 크게 세 가지가 있습니다. 각각의 방법에는 고유한 특징과 사용 용도가 있으며, 올바른 변수 선언은 깨끗하고 효율적인 코드를 작성하는 데 필수적입니다.1. var 키워드특징: 함수 범위를 가집니다. 즉, 함수 내에서 선언된 var 변수는 해당 함수 내에서만 유효합니다.호이스팅: 변수 선언이 코드의 맨 위로 끌어올려지는 현상이 발생합니다. 즉, 변수를 선언하기 전에 사용해도 undefined 값이 할당됩니다.단점: 함수 범위라는 제한적인 스코프와 호이스팅으로 인해 예상치 못한 결과를 초래할 수 있습니다. function myFunction() { console.log(x); // undefined 출력 (호이스팅) var x = 10; console.log(x);..

JS/JavaScript 2024.08.27

#6 HTML 태그

HTML 태그 종류와 용도 및 사용 예시1. 문서 구조 태그: HTML 문서 전체를 감싸는 최상위 태그입니다.      : 실제로 보이는 웹 페이지의 내용을 담는 부분입니다.  제목입니다 본문 내용입니다.  2. 텍스트 콘텐츠 태그 ~ : 제목을 나타냅니다. 숫자가 작을수록 제목의 크기가 커집니다. 주제소제목  : 단락을 나타냅니다. 이것은 하나의 단락입니다.  : 특정 텍스트에 스타일을 적용할 때 사용합니다. 파란색 텍스트  : 줄 바꿈을 합니다. 첫 번째 줄두 번째 줄  : 수평선을 그립니다.   3. 목록 태그: 불렛(원형 마커) 목록을 생성합니다.  사과 바나나 딸기  : 번호 목록을 생성합니다.  첫 번째 두 번째 세 번째  : 정의 목록을 생성합니다.  HTML HyperT..

HTML&CSS 2024.08.25

#5 HTML 시맨틱 태그

시맨틱 태그란 무엇일까요?HTML 시맨틱 태그는 웹 페이지의 각 요소에 의미를 부여하는 태그입니다. 단순히 내용을 표현하는 것을 넘어, 해당 요소가 무엇을 의미하는지 명확하게 해줍니다.예를 들어, 태그는 단순히 내용을 감싸는 역할만 하지만, 나의 웹사이트 홈 소개 연락처 첫 번째 게시글 이것은 시맨틱 태그를 이용한 예시입니다. © 2023 나의 웹사이트   시맨틱 태그 활용 시 주의사항중복 사용 금지: 하나의 요소에 여러 개의 시맨틱 태그를 중복해서 사용하면 안 됩니다.의미에 맞게 사용: 시맨틱 태그는 단순히 디자인을 위해 사용하는 것이 아니라, 해당 요소의..

HTML&CSS 2024.08.25

#4 HTML5의 새로운 기능

HTML5는 웹 개발의 혁신을 이끈 강력한 도구입니다. 기존 HTML의 단점을 보완하고 새로운 기능을 추가하여 웹 페이지를 더욱 풍부하고 동적으로 만들 수 있도록 해줍니다.1. 멀티미디어 지원 강화HTML5 이전에는 웹 페이지에 동영상이나 음악을 삽입하려면 플러그인이 필요했습니다. 하지만 HTML5에서는 와 태그를 통해 별도의 플러그인 없이 웹 페이지에서 바로 멀티미디어 콘텐츠를 재생할 수 있습니다.HTML Your browser does not support the video tag.   2. 캔버스 (Canvas)캔버스는 HTML5에서 새롭게 추가된 요소로, 자바스크립트를 이용하여 동적인 그래픽을 그릴 수 있는 공간을 제공합니다. 게임, 데이터 시각화, 이미지 편집 등 다양한 분야에서 활용됩니..

HTML&CSS 2024.08.25

#3 HTML 요소와 속성

HTML 요소와 속성이란 무엇일까요?HTML 문서를 구성하는 가장 기본적인 단위를 **요소(element)**라고 합니다. 요소는 특정한 의미나 기능을 나타내며, 와 > 기호로 둘러싸인 태그 쌍으로 표현됩니다. 예를 들어, 태그는 단락을 나타내고, 태그는 가장 큰 제목을 나타냅니다.**속성(attribute)**은 요소에 대한 추가적인 정보를 제공하는 역할을 합니다. 속성은 요소의 시작 태그 안에 name="value" 형식으로 작성됩니다. 예를 들어, 태그의 src 속성은 이미지 파일의 경로를 나타내고, alt 속성은 이미지에 대한 설명을 제공합니다.HTML 요소의 종류와 예시HTML에는 다양한 종류의 요소가 있습니다. 몇 가지 주요 요소와 예시를 살펴볼까요?문서 구조 요소:: HTML 문서의 전..

HTML&CSS 2024.08.25
반응형