funfunweb

1. 단축키 R 박스 크기 280*390 radius 20px 사각형 그리기2. 전체 박스 선택 후 auto layout (shift + a)3. 전체 박스 선택 된 상태에서 plug in - unsplash 검색 후 이미지 넣기4. 전체 선택된 상태에서 ctrl + c, ctrl + v5. 복사된 요소들 모두 선택 후 ctrl + alt + G6. 프레임 크기 1440px , Clip content 체크해보기7. Frame2 복사 후 8. Frame3 의 Frame1 선택 후 같은 이미지가 보일 수 있도록 정렬(clip content 체크 해제후 하면 다 보여요)(복제된 요소의 첫번째 카드를 시작지점으로 이동하여 첫번째 원래 카드와 동일한 위치에 있도록 배치) 9. 두개의 Frame (Frame2, ..

See the Pen 스크롤시 텍스트 움직이기 by 정은 (@luchiaChoi) on CodePen.위 코드 설명document.addEventListener('DOMContentLoaded', () => { // 1. 요소들을 선택하고 // 2. 스크롤 이벤트가 발생할 때마다 // 3. 각 섹션의 위치를 계산해서 // 4. 특정 위치에 도달하면 클래스(show)를 추가}); 문서 로딩 완료시 실행document.addEventListener('DOMContentLoaded', () => { 이벤트 이름: DOMContentLoaded의미: HTML 문서의 모든 요소가 로딩되었을 때 실행됩니다.왜 필요한가요?: querySelector를 사용할 때, DOM 요소가 존재해야 하므로 문서가 완..

🔑 BigInt - 아주 큰 정수를 다루기 위한 타입 📌 소개BigInt는 일반 숫자(Number)가 표현할 수 있는 범위를 넘는 아주 큰 정수를 다룰 수 있게 해줍니다.일반 Number는 약 ±253 (약 9천조) 까지만 정확히 표현할 수 있어요.BigInt는 이보다 훨씬 큰 숫자를 정확하게 저장하고 연산할 수 있습니다.✅ 사용 예시const regularNumber = 9007199254740991; // Number.MAX_SAFE_INTEGERconst bigNumber = 9007199254740991n + 1n;console.log(bigNumber); // 출력: 9007199254740992nconsole.log(typeof bigNumber); // 출력: "..

숫자 반환:function getNumber() { return 42;}console.log(typeof getNumber()); // 출력: "number"객체 반환:function getUser() { return { name: "Alice" };}console.log(typeof getUser()); // 출력: "object"boolean 반환:function isActive() { return true;}console.log(typeof isActive()); // 출력: "boolean"배열(array)반환:function getArray() { return [1, 2, 3];}console.log(getArray()); // 출력: [1, 2, 3]console.log..

자바스크립트에서 undefined는 값이 정의되지 않은 상태를 나타내는 기본 제공 데이터 타입입니다. 일반적으로 변수는 선언되었지만 초기화되지 않았을 때 undefined 값을 가집니다. ✅ 1. 변수 선언만 하고 값을 할당하지 않은 경우let a;console.log(a); // 출력: undefinedlet a;console.log(a); // 출력: undefinedconsole.log(typeof a); // 출력: "undefined"변수 a는 선언만 되었고, 값이 할당되지 않았기 때문에 undefined입니다. ✅ 2. 존재하지 않는 객체 속성에 접근할 때const person = { name: "John" };console.log(person.age); // 출..

1. undefined란?**"값이 할당되지 않은 상태"**를 나타냅니다.변수가 선언만 되고 초기화되지 않은 상태일 때 기본값으로 자동 할당됩니다.함수에서 명시적으로 값을 반환하지 않으면 undefined를 반환합니다.객체에 존재하지 않는 프로퍼티를 접근할 때도 undefined가 나옵니다.예시let a;console.log(a); // undefined (값이 할당되지 않음)function foo() {}console.log(foo()); // undefined (반환값 없음)const obj = {};console.log(obj.prop); // undefined (존재하지 않는 속성) 2. null이란?"값이 없음"을 명시적으로 나타내는 특수한 값입니다.개발자가 변..

1. typeof null → "object"인 이유 (역사적 버그)배경자바스크립트가 처음 만들어질 때, 값들은 메모리 내에서 특정 비트 패턴으로 저장됩니다.null 값은 내부적으로 null 포인터를 의미하는 값으로 저장됐고,typeof 연산자는 메모리에서 **값의 타입 태그(type tag)**를 검사하는데,초기 구현에서 null의 타입 태그가 객체(object)로 인식되어 버렸습니다.그래서…typeof null이 "object"로 나오는 것은 자바스크립트 엔진의 오래된 설계 결함입니다.이 문제는 표준이 된 이후로도 수정되지 않았기 때문에 여전히 존재합니다.대부분의 개발자들이 이를 알고 있으므로, null 타입 체크할 때는 별도로 확인합니다.올바른 null 체크 방법 let value = null;co..

기본 개념자바스크립트에서 + 연산자는 숫자 덧셈뿐 아니라,하나라도 문자열이 있으면 문자열 연결(concatenation) 기능을 수행합니다.예시 1: 숫자 덧셈console.log(10 + 5); // 15 (숫자 덧셈) 예시 2: 문자열 연결console.log("apple" + " pie"); // "apple pie" 만약 +가 없으면? document.write("fruit의 타입은 ", typeof fruit); document.write()는 여러 인자를 지원하지 않으므로,두 번째 인자는 무시되거나 오류가 발생할 수 있습니다.따라서 문자열 연결 시 반드시 +를 사용해야 합니다.정리+ 연산자는 문자열 + 문자열 → 문자열 연결typeof는 데이터 타입을 문자열로 반환하므로, +와 함께 쓰면 ..

✅ 1. 자바스크립트 데이터 타입 분류🔹 원시(Primitive) 데이터 타입string – 문자열 ("hello")number – 숫자 (42, 3.14)bigint – 큰 정수 (12345678901234567890n)boolean – 참/거짓 (true, false)undefined – 값이 정의되지 않음null – 명시적 “없음”symbol – 고유한 식별자🔹 객체(Object) 데이터 타입Object – 일반 객체 { key: value }Array – 배열 [1, 2, 3]Function – 함수 function() {}Date, RegExp, Map, Set 등✅ 2. 데이터 타입 확인 방법① typeof – 기본 타입 확인typeof 123; // "number"typ..