본문 바로가기

분류 전체보기474

자료형 String(문자 데이터): 따옴표를 사용 let myName = "hello1"; let email = 'hello@gmail.com'; let hello = `Hello ${myName}?!`; // 보간법 (백틱 기호 사용) console.log(myName); console.log(email); console.log(hello); Number(숫자 데이터): 정수 및 부동소수점 숫자를 나타냄 let number = 123; let opacity = 1.57; console.log(number); console.log(opacity); console.log(number + opacity); Boolean(불린 데이터): true, false 두 가지 값밖에 없는 논리 데이터 let checked =.. 2021. 4. 29.
표기법 dash-case(kebab-case): HTML, CSS에서 많이 사용 the-quick-brown-fox-jumps-over-the-lazy-dog snake_case: HTML, CSS에서 많이 사용 the_quick_brown_fox_jumps_over_the_lazy_dog camelCase: JS에서 많이 사용 theQuickBrownFoxJumpsOverTheLazyDog ParcelCase: JS에서 많이 사용 TheQuickBrownFoxJumpsOverTheLazyDog Zero-based Numbering: 0기반 번호 매기기, 특수한 경우를 제외하고 0부터 숫자를 시작 주석 // 한 줄 메모 /* 한 줄 메모 */ /** * 여러줄 메모1 * 메모 2 */ 2021. 4. 29.
오버워치 영웅 선택 화면 실습 출처: GitHub - ParkYoungWoong/overwatch-hero-selector-vanilla ParkYoungWoong/overwatch-hero-selector-vanilla Contribute to ParkYoungWoong/overwatch-hero-selector-vanilla development by creating an account on GitHub. github.com css 초기화: www.jsdelivr.com/package/npm/reset-css jsDelivr - A free, fast, and reliable CDN for Open Source Supports npm, GitHub, WordPress, Deno, and more. Largest network an.. 2021. 4. 29.
CSS 변환 효과 (요소의 변환 효과) transform: 변환함수1 변환함수2 변환함수3 .... ; transform: 원근법 이동 크기 회전 기울임; 2D 변환 함수 translate(x,y): 이동(x축, y축) translateX(x): 이동(x축) translateY(y): 이동(y축) scale(x,y): 크기(x축, y축) scaleX(x): 크기(x축) scaleY(y): 크기(y축) rotate(degree): 회전(각도) ex) 45deg skew(x,y): 기울임(x축, y축) skewX(x): 기울임(x축) skewY(y): 기울임(y축) matrix(n,n,n,n,n,n): 2차원 변환 효과 AB body { padding: 100px; } div { width: 100px; height: 100px; backgrou.. 2021. 4. 28.
전환 효과 transition: 요소의 전환(시작과 끝) 효과를 지정하는 단축 속성 transition-property: 속성명 transition-duration: 지속시간 (단축형으로 작성할 때 필수 포함 속성) transition-timing-function: 타이밍함수 transition-delay: 대기시간 transition-property: 전환 효과를 사용할 속성 이름을 지정 all: 모든 속성에 적용 (기본값) 속성이름: 전환 효과를 사용할 속성 이름 명시 div { width: 100px; height: 100px; background-color: orange; transition: width .5s, background-color 2s; } transition-timing-function: 전환.. 2021. 4. 28.
스택(stack) Stack의 특징 맨 마지막 위치(top)에서만 자료를 추가, 삭제, 꺼내올 수 있음(중간의 자료를 꺼낼 수 없음) Last In First Out (후입선출) 구조 택배 상자가 쌓여있는 모양 가장 최근의 자료를 찾아오거나 게임에서 히스토리를 유지하고 이를 무를때 사용할 수 있음 함수의 메모리는 호출 순서에 따른 stack 구조 jdk 클래스: Stack package ch42; public class MyArray { int[] intArr; //int array int count; //개수 public int ARRAY_SIZE; public static final int ERROR_NUM = -999999999; public MyArray() { count = 0; ARRAY_SIZE = 10; i.. 2021. 4. 26.

티스토리툴바