IT19 위크맵 and 위크셋 위크맵 맵과 위크맵의 첫 번째 차이는 위크맵의 키가 반드시 객체여야 한다는 점입니다. 원시값은 위크맵의 키가 될 수 없습니다. let weakMap = new WeakMap(); let obj = {}; weakMap.set(obj, "ok"); //정상적으로 동작합니다(객체 키). // 문자열("test")은 키로 사용할 수 없습니다. weakMap.set("test", "Whoops"); // Error: Invalid value used as weak map key 위크맵의 키로 사용된 객체를 참조하는 것이 아무것도 없다면 해당 객체는 메모리와 위크맵에서 자동으로 삭제됩니다. 위크맵 지원 메소드 weakMap.get(key) : 키에 연결된 값 불러오기 weakMap.set(key, value) :.. IT/JavaScript 2022. 2. 11. var, let 차이점 변수 선언 방식 예전 코드 들을 찾아보다 보면 생각보다 var를 많이 볼수 있다. 이제는 var 대신 let을 많이 쓰지만 사실 왜 let을 사용하는지는 잘 모르고 사용해왔다. 그래서 오늘은 var를 알아보고자 한다. ' var '는 블록 스코프가 없다. var로 선언한 변수의 스코프는 함수 스코프이거나 전역 스코프입니다. 블록 기준으로 스코프가 생기지 않기 때문에 블록 밖에서 접근 가능합니다. 블록 밖에서 접근 할수 있다고 한다. if (true) { var test = true; // 'let' 대신 'var'를 사용했습니다. } alert(test); // true(if 문이 끝났어도 변수에 여전히 접근할 수 있음) (출처 : 모던자바스크립트) 해당 코드가 실행이 가능해진다는 것이다. 이렇게 짧은 .. IT/JavaScript 2022. 2. 2. 가비지 컬렉션 가비지 컬렉션(Garbage Collection) 메모리 관리 기법 중 하나로 메모리를 가지고 있지 않은 영역을 해제하는 기능이다. 우리가 사용하는 자바스크립트 는 메모리의 도달 가능성을 기준으로 메모리 관리를 수행한다. 메모리가 참조하지 않고 있다면 해당 변수를 제거하는 기능인데 예를 들어보자 ① X = 10; ②Y = X; ③X = 5; X = ? or Y = ? ①. X는 10이라는 값의 주소를 가지고 있다. ②. Y = X의 주소를 참조한다.( 주소값을 가진다.) ③X는 10의 주소값을 버리고 5라는 값의 주소값을 가진다. 정답 : X = 5 or Y = 10 ※드래그 하세요 위 상황처럼 값이 버려진 10의 주소값은 가비지 컬렉터(garbage collector)에 Select 되어 자동으로 삭제.. IT/JavaScript 2022. 2. 1. 함수란? 함수는 프로그램을 구성하는 주요 '구성 요소(building block)'입니다. 함수 선언 방식으로 함수를 만들 수 있습니다. function 함수이름(복수의, 매개변수는, 콤마로, 구분합니다) { /* 함수 본문 */ } 함수에 전달된 매개변수는 복사된 후 함수의 지역변수가 됩니다. 함수는 외부 변수에 접근할 수 있습니다. 하지만 함수 바깥에서 함수 내부의 지역변수에 접근하는 건 불가능합니다. 함수는 값을 반환할 수 있습니다. 값을 반환하지 않는 경우는 반환 값이 undefined가 됩니다. 깔끔하고 이해하기 쉬운 코드를 작성하려면 함수 내부에서 외부 변수를 사용하는 방법 대신 지역 변수와 매개변수를 활용하는 게 좋습니다. 개발자는 매개변수를 받아서 그 변수를 가지고 반환 값을 만들어 내는 함수를 더.. IT/JavaScript 2022. 1. 31. 자바스크립트 자료형 자바스크립트 자료형 숫자형 : 정수, 부동 소수점 숫자 등의 숫자를 나타낼 때 사용한다. bigint : 길이 제약 없이 정수를 나타낼 수 있습니다. 문자형 : 빈 문자열이나 글자들로 이루어진 문자열을 나타낼 때 사용한다. 불린형 : true, false를 나타낼 때 사용한다. null : null 값만을 위한 독립 자료형이다. 단일 문자를 나타내는 별도의 자료형은 없다. undefined : undefined 값만을 위한 독립 자료형이다. 객체형 : 복잡한 데이터구조를 표현할 때 사용한다. 심볼형 : 객체의 고유 식별자를 만들 때 사용한다. typeof 연산자는 피연산자의 자료형을 알려줍니다. typeof x 또는 typeof(x) 형태로 사용한다. 피연산자의 자료형을 문자열 형태로 반환한다. null.. IT/JavaScript 2022. 1. 28. 상단 메뉴 고정 & position: fixed 목적 페이지 마크업 연습 및 기록 남기기 Top Menu List Fixed 고정 마크업 사이트들을 살펴 볼때 이 처럼 스크롤을 내려도 상단이 고정되어 있는 것을 볼 수 있다. .top-list { position: fixed; top: 0; width: 100%; display: flex; justify-content: space-evenly; background-color: white; } css top-list 에서 position : fixed; top: 0; width: 100%; or left: 0; right: 0; width: 100%; 를 설정하든 left: 0; right: 0;을 하던 값은 같다. 설정을 해주면 상단 메뉴바가 고정 되는 것을 확인할수 있다. 여기서 문제! 상단 메뉴가 .. IT/HTML 2022. 1. 22. HTML 페이지 구조 연습 & 페이지 마크업 연습 목적 나는 국비교육으로 백엔드 쪽을 배웠지만 프론트 부분이 더 좋을것 같다고 판단하여(?) 프론트 부분을 준비하려고 오늘부터 공부 한 것에 대한 글을 남겨 보고자 한다. 페이지 구조 연습 페이지의 영역을 큰 단위로 빨간색으로 묶고 영역 안에서 레이아웃을 나눌때는 주황색으로 반복되는 것 들을 묶을 때는 노란색으로 요소들을 묶을 때는 하늘색으로 하나의 요소들을 묶을 때는 파란색으로 그려서 구조 연습을 진행한다. ※ 준비물 ※ 1. 크롬 -> 크롬 웹스토어 -> GoFullPage - Full Page Screen Capture 확장프로그램 설치 확장프로그램으로 페이지 전체 스크린샷을 " 1_전 " 으로 저장하고 2. 그림판 그림판으로 영역 나누기 후 " 1_후 " 로 저장한다. 본 그림은 처음 작업 한 페이.. IT/HTML 2021. 12. 31. 이전 1 2 다음