Study/JavaScript5 [JavaScript] 자바스크립트의 this 자바스크립트에서 this는 함수가 호출되는 방식에 따라 달라지는 특수한 객체를 가리킵니다.쉽게 말해, this는 "누가 나를 불렀냐"를 의미해요. 이번 포스트에서는 this를 상황별로 살펴보죠!함수에서의 this 함수가 일반적으로 호출되면, this는 전역 객체를 가리킵니다. 브라우저에서는 window 객체가 전역 객체죠. function sayHi() { console.log(this)}sayHi() // 출력: window 객체메서드에서의 this 객체 안에 있는 메서드에서 this는 그 메서드를 호출한 객체를 가리킵니다.const person = { name: 'Alice', sayHi: function() { console.log(this.name) }}person.sayHi() .. 2024. 10. 24. [JavaScript] 반복문 활용 JavaScript도 하나의 프로그래밍 언어인 만큼, 반복문을 사용할 수 있습니다.파이썬과 똑같은 점은 javascript 반복문에서도 while과 for를 사용한다는 건데요, 형식은 조금 다릅니다. 이번 포스트에서는 JavaScript에서 반복문을 사용하는 방법을 살펴보겠습니다!whilewhile문은 조건문이 참일 때 문장을 계속해서 수행하는 반복문입니다.let i = 0while (i forJavaScript에서 for문은 3가지 형태가 있습니다.기본 형태for ... in 형태for ... of 형태기본 형태for (let i = 0; i for ... in 형태for ... in 형태는 객체의 열거 가능한 속성(property)에 대해 반복합니다.인덱스의 순서가 중요한 배열에서는 사용하지 않아요!.. 2024. 10. 22. [JavaScript] 조건문 활용 JavaScript도 하나의 프로그래밍 언어인 만큼, 조건문을 사용할 수 있습니다.이번 포스트에서는 JavaScript에서 조건문을 사용하는 방법을 살펴보겠습니다!ifif는 조건 표현식의 결과값을 boolean 타입으로 변환 후 참/거짓을 판단합니다. javascript의 if문 형태는 다음과 같습니다.const age = 20if (age >= 0 && age = 20) { console.log('성인')} else { console.log('올바른 나이를 입력하세요.')}삼항 연산자삼항 연산자는 간단한 조건부 로직을 간결하게 한 줄로 표현할 때 유용합니다.condition ? expression1 : expression2condition평가할 조건 (true 또는 false로 평가)expressi.. 2024. 10. 22. [JavaScript] 연산자 종류와 활용 JavaScript 언어를 처음 접했다면, 기본적인 syntax부터 익혀야합니다.이번 포스트에서는 그 중 가장 기초가 되는 "연산자"에 대해 알아겠습니다!할당 연산자오른쪽에 있는 피연산자의 평가 결과를 왼쪽 피연산자에 할당하는 연산자단축 연산자 지원let a = 0a += 10console.log(a) // 10a -= 5 // 10 - 5console.log(a) // 5a *= 6 // 5 * 6console.log(a) // 30a %= 7 // 30 % 7console.log(a) // 2a /= 2 // 2 / 2console.log(a) // 1증가 & 감소 연산자증가 (++) 피연사자를 증가(1을 더함)시키고 연산자의 .. 2024. 10. 22. [JavaScript] DOM 조작하기 DOM(The Document Object Model)이란, 문서의 요소들을 객체로 제공하여 다른 프로그래밍 언어에서 접근하고 조작할 수 있는 방법을 제공하는 API를 말합니다. DOM을 조작할 때는 아래 순서를 따라야합니다.조작 하고자 하는 요소를 선택선택된 요소의 콘텐츠 또는 속성을 조작DOM 선택document.querySelector()제공한 선택자와 일치하는 element 한 개 선택⇒ 제공한 선택자를 만족하는 첫 번째 element 객체를 반환 (없다면 null 반환)document.querySelectorAll()제공한 선택자와 일치하는 element 여러 개 선택⇒ 제공한 선택자를 만족하는 NodeList 반환DOM 조작DOM 조작은 크게 아래 4가지로 분류할 수 있습니다.속성 조작클래스 .. 2024. 10. 21. 이전 1 다음
