전체 글(66)
-
배열
프로퍼티의 key가 숫자이며 프로퍼티 간의 순서를 가지는 객체 1) 배열 생성 : [] 대괄호나 배열 생성자로 생성 const array = []; const array = new Array(length); 2) 배열 접근 array[index] -> index는 0부터 시작 const colors = ['red', 'blue', 'green', 'pink', 'mint']; console.log(typeof colors); // object -> 배열도 객체로 구현한 것이기 때문 console.log(colors[2]); // 인덱스 접근, 인덱스는 0부터 시작 //green console.log(colors.length); // 자체적으로 length라는 프로퍼티가 있음 //5 3) 배열 관련 함수 ..
2023.04.16 -
객체
1. 객체 기본 객체는 사전적인 정의로 실제 존재하는 것을 의미함 1) 객체 생성: {}중괄호나 객체 생성자로 생성 const obj = {}; const obj = new Object(); 2) 객체 구조 사람 = { key: value} // 이 때 중괄호 안에 들어가는 key: value를 프로퍼티(property)라고 함 3) 객체 접근 점 표기범 : obj.key 대괄호 표기법 : obj[key] 사람. 성별 사람. 말하다() 2. 객체 응용 1) 객체 관련 함수 삭제 : delete obj.name; 프로퍼티 유무 : property1 in obj 반복 : for (변수 in obj) { // 변수를 이용한 코드 } 옵셔널 체이닝 : obj?.property?.subProperty 구조 분해 ..
2023.04.16 -
함수
함수 비슷한 코드가 반복해서 사용될 때 사용한다. 1) 함수 선언식 function 함수이름(매개변수 = 기본값) { // 코드 } 2) 함수 표현식 const 함수이름 = function(매개변수) { // 코드 } let a = 2; const makeNumber = function (value = 10000) { // 초기값 // 숫자가 아니거나 0보다 작으면 0으로 return, 넘겨진 value를 숫자형으로 만들어서 return if (value < 0) return 0; // early return let a = 1; // console.log(a); // 지역변수가 전역변수를 가림 const newValue = Number(value); return isNaN(newValue) ? 0 : n..
2023.04.16 -
조건문과 반복문
1. 조건문 1) if if(조건1){ 조건1이 참일 때(1) } else if (조건2) { 조건1이 거짓 / 조건2가 참일 때 (2) } else { 조건1, 2가 모두 거짓일 때 (3) } 2) 삼항 연산자 조건 ? // 조건이 참일 때 (1) : // 조건이 거짓일 때 (2) 3) switch switch (값) { case 케이스1 : // 값이 케이스1일 때 break; default : // 앞선 케이스들에 하나도 해당되지 않을 때 } 2. 반복문 1)for for (초기; 조건; 실행){ // 반복되는 코드 } for (let a = 1; a < 10; a++) { 회원번호 a에게 포인트 제공 } 2) while 초기 while(조건){ // 반복되는 코드 실행 } let a = 1; wh..
2023.04.16 -
자료형과 형 변환
1. 자료형 1) 숫자형 infinity -infinity NaN 2) BigInt형 2^53-1보다 크거나 -(2^52-1)보다 작은 정수 표현 3) 문자형 변화 가능한 "",''과 변화 불가능한 ``으로 표현가능 4) 불린형 참/거짓 5) null, undefined null: 비어있음 undefined: 값이 할당되지 않음 6) 객체형 Symbol 객체 호스트 객체 함수 객체 그 회의 객체 typeof 연산자로 변수의 타입 확인! 2. 형 변환 언어 자체에서 자동으로 제공하는 묵시적 형 변환과 개발자가 형 변환을 명시하는 명시적 형 변환이 있음 1) 묵시적 형 변환 console.log(3); => 전달된 값을 문자로 변환함 +"32" => 숫자형으로 변환함 !0 => 불린형으로 변환함 2) 명시적..
2023.04.16 -
반응형 작업 시 미디어쿼리 최소화 하는 방법
1. 미디어 쿼리 화면(screen), 티비(tv), 프린터(printer)와 같은 미디어 타입과 적어도 하나 이상의 표현식으로 구성된다. 표현식은 width, height, color와 같은 미디어 특성들을 이용하여 그 특성들의 상태에 따라 다른 스타일 시트를 적용할 수 있다. 미디어쿼리는 CSS3에 포함되어 있으며, 컨텐츠의 변경없이 주로 화면의 크기에 따라 스타일 시트를 달리하여 적절한 모양을 보여줄 수 있다. 미디어 쿼리는 1) link요소에 media 속성으로 적용하는 방법 2) 스타일 시트 내에서 @media를 사용하는 방법 @media screen and (max-width: 768px) { body { background-color: lightgreen; } } 미디어 타입은 스크린이고 화..
2023.04.16