JS, TS 썸네일형 리스트형 [실습][Javascript] To Do List 만들기 (Nomad Coders) https://joohaem.github.io/ ToDoList joohaem.github.io 시간 구현 name form - local storage to do - local storage button - remove list & local storage background image weather API (openweathermap) 더보기 [Javascript] 옵셔널 체이닝 (Optional chaining; ?.) 으로 다중 체크하기 / ?? 연산자 옵셔널 체이닝(Optional chaining; ?.) 을 사용하면 중첩 객체에 안전하게 접근할 수 있다 이는 최신 문법이므로 구식 브라우저는 확인이 필요하다 예를 들어 다음과 같은 코드를 실행한다고 가정하자 exchange.links.website.map(~); exchange의 객체 배열에서 links 혹은 website가 있을 수도, 없을 수도 있다고 한다면 우리는 다음과 같이 && 연산자를 통해 트리플 체크를 해주어야 한다 exchange.links && exchange.links.website && exchange.links.website.map(~); 이처럼 참조가 누락될 가능성이 있는 경우 옵셔널 체이닝으로 더 짧고 간단한 표현식이 생성된다 exchange.links?.website?.map.. 더보기 [Javascript] JS 자료형변환 (to String / to Number / to Boolean) to String String( number || boolean ) ( number || boolean ).toString() "" + (number || boolean) `${ number 변수명 || boolean 변수명 }` to Number Number( string || boolean ) parseInt( 정수형의 string ) or parseFloat( 실수형의 string ) + (string || boolean) (string || boolean) * 1 to Boolean Boolean( 숫자 || 문자열 || 객체 || undefined || null ) !! ( 숫자 || 문자열 || 객체 || undefined || null ) Number 확인 전역변수 isFinite( valu.. 더보기 [Javascript][ES5] Array reduce() Array map(), sort(), filter(), forEach(), includes(), push() 메소드 -> https://snupi.tistory.com/144 [Javascript][ES5] Array map() / filter() / forEach() / includes() / push() Array map() map() 메서드는 배열의 모든 아이템에 대하여 function을 실행하는 메소드이다. 그리고 나서 function의 결과 값으로 새로운 배열을 만든다. const alphabets = ["a", "b", "c"]; const showingA = al.. snupi.tistory.com reduce() 메소드는 배열의 각 요소에 대해 주어진 reducer() 함수를 실행하고, 하.. 더보기 [실습][Javascript] 마우스 클릭 연습 출처 : 명품 웹 프로그래밍 마우스 클릭을 연습하는 웹 페이지를 작성해보자. 10x10의 셀을 가진 표를 만들고 랜덤하게 선택한 셀에 이미지를 출력하라. 이미지를 클릭하면 다른 셀을 랜덤하게 선택하여 이미지를 출력한다. 우선, 다음과 같이 초기 표를 구성한다 css는 다음과 같다 .main_box { width: 600px; margin: 50px auto; text-align: center; } .random_table { table-layout: fixed; width: 100%; border-collapse: collapse; } .random_table td { border: 3px #000 solid; width: 50px; height: 50px; } 1. 셀 안의 이미지를 로 삽입하여 이미지.. 더보기 이전 1 2 3 4 5 6 다음
