bergerac 님의 블로그

객체의 속성 존재 여부 확인하기조건문+ undefinedlet obj = { name: 'bergerac' };if (obj.name !== undefined) { console.log(obj.name);} else { console.log('name 속성 X');}논리연산자 활용obj.name || console.log('name 없음'); // 출력 Xobj.hobby || console.log('hobby 없음'); // hobby 없음obj.name && console.log('이름 있음'); // 이름 있음삼항 연산자로 기본값 설정obj.nickname = obj.nickname ? obj.nickname : '임시 닉네임';console.log(obj.nickname); // "임시..

JavaScript에서는 **내장 객체(Built-in Object)**를 통해 복잡한 작업을 쉽게 처리할 수 있도록 다양한 속성과 메서드를 제공합니다. 이 글에서는 Number, String, JSON, Math, Date 객체의 주요 기능들을 정리해보겠습니다. Number 객체toFixed(N) : 소수점 N자리까지 반올림한 문자열을 반환합니다.let num = 123.4567;num.toFixed(3); // "123.457"num.toFixed(1); // "123.5"num.toFixed(); // "123"Number.isNaN() / Number.isFinite()각각 NaN, Infinity 여부를 확인합니다.let notNum = Number("abc"); // NaNconsole.lo..

이벤트 객체란?이벤트 객체는 이벤트 핸들러가 호출될 때 브라우저가 자동으로 생성하여 전달하는 객체입니다. 이 객체에는 이벤트와 관련된 다양한 정보와 기능이 포함되어 있으며, 사용자는 이를 통해 이벤트가 발생한 요소, 이벤트의 유형, 기본 동작 제어, 이벤트 전파 제어 등을 처리할 수 있습니다. 이벤트 객체의 주요 속성과 메서드1. type이벤트의 종류를 나타낸다.console.log(event.type); // "click"2. target이벤트가 발생한 요소를 참조함으로써 실질적으로 이벤트가 발생한 요소를 의미하며 이벤트 발생 시 변경을 적용할 요소를 결정하는데 유용하다. 예를들어, 여러 요소에 이벤트를 걸어줄 때 어떤 요소에서 이벤트가 발생했는지 알 수 있다.function bgChange(event..

📌 1. 이벤트(Event)란?이벤트란 웹 페이지에서 발생하는 다양한 상황들을 의미합니다. 예를 들어 버튼 클릭, 마우스를 올리기, 키보드 입력, 스크롤, 페이지 로딩 등 모든 사용자 행동이 이벤트입니다.📌 2. 이벤트 핸들링(Handling)이란?이벤트 핸들링이란 특정 이벤트가 발생했을 때 실행할 동작을 지정하는 것, 즉 이벤트에 "반응"하는 코드를 작성하는 것을 말합니다.이벤트가 발생했을 때 호출되는 함수를 이벤트 핸들러(Event Handler) 혹은 이벤트 리스너(Event Listener) 라고 부릅니다.📌 3. 주요 이벤트 종류자바스크립트에는 매우 다양한 이벤트 종류가 있으며, 대표적으로 아래와 같은 카테고리로 나뉩니다.🖱️ 마우스 이벤트click: 요소 클릭dblclick: 더블 클릭..

자바스크립트에서 객체는 단순한 데이터 저장소를 넘어서, 기능(매서드)까지 담을 수 있는 유연한 구조입다. 이때 객체의 원형(프로토타입)을 사용하여 새로운 객체를 생성하는 것이 프로토타입 입니다. 모든 객체들이 메서드와 속성을 상속받기 위한 템플릿으로써 프로토타입 객체를 가집니다. 1. 생성자 함수와 프로토타입new키워드를 사용해 함수를 호출할 수 있으며 관례적으로 UpperCamelCase를 사용합니다.function Person(firstName, lastName, age, gender) { this.name = { first: firstName, last: lastName }; this.age = age; this.gender = gender; this.greeting = func..

객체란? 정의: 관련된 **데이터(속성, 프로퍼티)**와 **함수(기능, 메서드)**를 하나로 묶은 집합입니다.역할: 다양한 값을 담을 수 있는 컨테이너이자, 동작을 포함한 구조체입니다.참고: 배열도 객체의 일종입니다. typeof [1, 2, 3]을 실행하면 결과는 object입니다.console.log(typeof([1,2,3]));//object 객체의 구조프로퍼티(Property)객체가 가지는 데이터 입니다.ex) 이름, 나이, 키, 직업 등let objectName = { 키1: 값1, 키2: 값2 ...}const person = { name: 'bergerac', age: 25, height: 179, speak: function() { console.log('안녕하세요!'..

1. 매개변수(parameter)vs 인자(argument)매개변수란? : 함수에 전달될 데이터를 담는 변수인자란? : 함수 호출 시에 전달하는 값***자바에서와는 다르게 타입 명시 불요 2. JS에서의 파라미터와 아규먼트 특징파라미터와 아규먼트의 수가 반드시 일치할 필요가 없다.  매개변수의 차례로 인자값이 전달되기 때문에 형식이 맞지 않아도 그대로 적용이 되어버릴 수 있는 문제점이 있다. 3. 반환값(return, 리턴값)결과를 반환하며 함수 내에서 return 키워드가 읽히면 함수의 실행을 즉시 중단하고 return 뒤의 값을 반환한다.return 뒤의 코드는 읽히지 않기 때문에 화면에 굉장히 희미하게 표시가 된다. 4. 함수 선언 방식 3가지//함수 선언문function square1(x) { r..

1. 함수의 정의특정 작업을 수행하거나 값을 계산하는데 사용되는 코드의 묶음(집합) >>자바의 메서드와 자바스크립트의 함수와의 차이자바스크립트의 경우 함수의 정의 keyword 가 function이다.자바는 반환타입을 정의하는데에 비하여 자바스크립트는 정의하지 않는다매개변수의 타입또한 정의하지 않는다.  >>따라서 자바스크립트은 모든 유형의 데이터가 전달 가능하며 모든 유형의 데이터 값 반환 가능  위과 같이 자바와는 다르게 int String 등의 반환타입이나 매개변수 타입을 설정하지 않아도( 즉, 숫자이거나 문자여도 sum이라는 함수가 동작함을 알 수 있다.) 2. 함수의 사용용도1) 코드 재사용ex) 두 수의 합을 계산 : f(x)=y 2)모듈화&추상화복잡한 작업을 수행하는 코드를 함수로 분리한다...

1. 배열이란?배열(Array)이란 여러 개의 데이터를 순차적으로 나열한 자료구조입니다.JavaScript의 배열은 다음과 같은 특징을 가지고 있습니다.다양한 타입의 데이터를 하나의 배열에 저장 가능배열의 크기가 동적 (필요에 따라 크기가 자동으로 조정)인덱스 번호를 통해 각 요소에 접근 (0부터 시작)let fruits = ['사과', '오렌지', '망고'];let mixed = [1, '문자열', true, null, [2, 3]]; 2. 배열 생성 방법1) 리터럴 방식let numbers = [1, 2, 3, 4, 5];let emptyArray = []; 2) Array 생성자 방식let arrayFruits1 = new Array(3); // 크기 지정 (빈 값)let arrayFruits2 =..