JavaScript
1.[JS_오답노트]_거듭제곱
제곱 연산 표현 방법?!
2.[JS_오답노트]_'역슬래쉬', '백틱'★★★
그냥 백틱 쓰는게 제일 편한듯
3.[JS_오답노트]_!!true? !!false?
! 는 NOT 논리 연산자. 2번 하면 긍정임! NOTNOT = YES
4.[JS_오답노트]_typeof 연산자
일단 typeof 연산자가 연산자임을 몰랐음 ㅎ
5.[JS_오답노트]_연산자 우선순위를 예제로 확인해보자!
괄호 → NOT → 사칙 → 비교 → AND → OR → 괄호 외의 연산자
6.[JS_오답노트]_형변환
형변환 생각보다 경우의 수가 많네?
7.[JS_오답노트]_기본 함수형
함수 기본형은 까먹지 말지어다...
8.[JS_오답노트]_undefined 와 null
처음에 선언하면 그냥 undefined라고 하며, 나머지는 전부 null임.
9.[JS_오답노트]_Return
return은 마감을 한다고 생각하자
10.[JS_오답노트]_Optional Parameter
그냥 매개변수 지정하지 못해도 값이 나오게 해주는 것
11.[JS_오답노트]_지역변수와 전역변수
{} 요거 안에서만 적용되거나, 맨 위에 선언될때만 적용됨.
12.[JS_오답노트]_const
const는 재할당 안되고, 선언만 하는거 안됨const 상수명은 무조건 대문자!
13.[JS_오답노트]_원의 넓이(함수)
원의 넒이 공식은 알지? ㅎ
14.[JS_오답노트]_IF문
구조만 확실하게 알고가자!
15.[JS_오답노트]_IF문 예제
탑승여부 체크!
16.[JS_오답노트]_IF문 예제2
서열정리하기!
17.[JS_오답노트]_Switch문
Switch는 보기나 선택이 가능한 경우에 사용하는 것이 좋다
18.[JS_오답노트]_While문
for문이 사용하기 편하긴 하다. 근데 고수들은 while 문을 더 선호하더라! 그래서 while문을 최대한 애용해보려고 한다.
19.[JS_오답노트]_구구단(for, while)
흐름을 제대로 이해하고 있어야만 풀 수가 있다.
20.[JS_오답노트]_피보나치 수열
일단 문제부터 풀어보셈!
21.[JS_오답노트]_객체(Object)
let 변수 = { 프로퍼티: 값 } 이 구조를 기억하자
22.[JS_오답노트]_객체 표기법
대괄호 표기법이 좀 범용성이 좋은듯.
23.[JS_오답노트]_프로퍼티 추가와 삭제
객체.프로퍼티 = '정보'; → 추가 delete 객체.프로퍼티 → 삭제
24.[JS_오답노트]_프로퍼티 확인(in으로)
'프로퍼티' in '객체' 를 콘솔출력하면, 존재유무를 확인!
25.[JS_오답노트]_객체 개념 한번에 보기!
출력 값과 코드를 비교해보면서 스스로 공부해볼것
26.[JS_오답노트]_영어단어장(프로퍼티의 값이 함수인 객체)
프로퍼티의 값이 함수라면?
27.[JS_오답노트]_const
const 다시 복습! 은근 헷갈림 ㅎㅅㅎ
28.[JS_오답노트]_let
let의 경우에는 값이 재할당 가능하다
29.[JS_오답노트]_var
var 은 가급적 쓰지말지어다.
30.[JS_오답노트]_함수는 지역? 전역?
함수 선언은 최상단에 하자.
31.[JS_오답노트]_new Date()_기본1
new Date(YYYY, MM, DD, hh, mm, ss);
32.[JS_오답노트]_new Date()_기본2
get메서드, set메서드는 그때그때 찾아보자
33.[JS_오답노트]_new Date()_기본3
Date.now() 는 today.getTime()를 의미한다/
34.[JS_오답노트]_new Date()_실습
난이도 최하
35.[JS_오답노트]_지수표기법 및 진법
e4 / e-4 ---- 0x, 0o, 0b
36.[JS_오답노트]_Number.toFixed()
toFixed()는 몇번째 자리까지 보여줄까? 임
37.[JS_오답노트]_진법변환_toString()
.toString() 은 진법 변환이자, 문자열로 변환 시키는 것
38.[JS_오답노트]_Math메소드
여기 있는 Math 종류는 가급적 외워두자.
39.[JS_오답노트]_숫자형 메소드_실습
해당 문제는 공식만 잘 대입하고, 반올림 또는 자릿수 읽기만 잘하면 된다!크게 어려웠던 문제는 아니었다.
40.[JS_오답노트]_배열 기본형태
배열의 기본적인 형태이다. 일단 형태만 좀 확인해보자
41.[JS_오답노트]_배열(1)
members[5] = '값' 넣으면 0~4까지 배열이지만 5로 추가가 됨
42.[JS_오답노트]_배열(2)
.splice( 인덱스, 갯수, '추가내용')
43.[JS_오답노트]_배열(3)
unshift, push, shift, pop
44.[JS_오답노트]_배열(4)
indexOf(), lastIndexOf(), includes(), reverse()
45.[JS_오답노트]_배열_실습1
배열 + 반복문 개념
46.[JS_오답노트]_배열_실습(2)
배열 + 반복문
47.[JS_오답노트]_배열_실습(3)
splice(0,0,value) : 추가 / splice(1,1) : 삭제
48.[JS_오답노트]_for(let variable of Array)
for( let Array[index] of Array ) { console } 형태라고 생각하자.
49.[JS_오답노트]_for(let array[index] of array)_실습
어렵다 어려워...
50.[JS_오답노트]_다차원 배열
array[col1][col2] 의 형식으로 부르면 될듯!
51.[JS_오답노트]_다차원배열_실습
array[rows][cols] 로 생각하자!
52.[JS_오답노트]_for(property in object)_실습
현재 점수를 scorefor(프로퍼티 in 객체) { 점수 += 객체프로퍼티 }하면, 현재 총점을 알수 있음
53.[JS_오답노트]_기본형이란?
말그대로 일반적인 형태이며, 복사를 했을때 값만 복사가 되는 형태!
54.[JS_오답노트]_참조형이란?
객체와 배열은 참조형이라서 2개이상의 참조배열과 객체에 일반적인 방식으로 추가하거나 수정하면 위의 결과처럼 똑같이 값이 바뀐다. ( 값 + 주소값 연결되는 개념 )
55.[JS_오답노트]_기본형 및 참조형_예제
y3 는 배열, z3 는 문자열(기본형)배열은 주소값이 복사가 되기 때문에 내용의 변화가 생기면 같이 변화한다. 문자열 같은 기본형은 완전한 복사가 되기 때문에 같은 값의 다른 기본형에 영향을 주지 않음.
56.[JS_오답노트]_배열_완전복사
slice()를 통해서 가져오면, 배열의 주소값은 복사가 되지 않음(완전복사)
57.[JS_오답노트]_객체_완전복사(1)
let course2 = Object.assign({}, course1)
58.[JS_오답노트]_객체_완전복사(2)
for(property in object) 형태로 해도 주소값은 복사 되지 않는다.
59.[JS_오답노트]_객체_완전복사(3)
for( key in object) 원리는 똑같다. 다만 일일이 계속 만들어야 하기 때문에 함수형으로 적용시킨 것이다.
60.[JS_오답노트]_객체_완전복사(4)
아까 for..in.. 문 함수적용 한 건 같은데, course8의 프로퍼티의 값이 배열인 경우가 있다.이럴 때, 배열프로퍼티에 값을 넣으면 주소값이 그대로 복사 되기 때문에... 이를 해결하기 위해서는 다음과 같은 어려운 코드가 동반되어야 한다....
61.[JS_오답노트]_참조형복사_실습
.slice(); 는 배열복사에 절대로 까먹지 말자.
62.[JS_오답노트]_문자열 심화(1)
문자열은 'String' 의 형태로 가져간다slice()는 전부 가져오는것slice(3)은 인덱스 3부터 끝까지 가져오는 것slice(0,2) 인덱스 0부터 2글자만 가져오는 것trim()은 공백제거toUpperCase(), toLowerCase()( 대문자로만 ),
63.[JS_오답노트]_문자열 심화(2)
문자열은 배열로 간주할수 있다. 하지만 배열과 문자열이 같지는 않다. 문자열에 for ... of ... 문을 적용할 수 있다. 하지만 배열은 아니다. 배열처럼 쓰는 것배열의 내용을 바꾸는 느낌으로 수정을 요청하면, 배열의 경우에는 당연히 되지만 문자열은 되지 않는다.
64.[JS_오답노트]_문자열 심화_실습
slice()를 쓰게 되면 굉장히 간단하게 풀 수 있다.해당 문구의 제일 앞쪽이 기준인덱스라서 원하는 문구부터, 원하는 문구의 다음까지 끝어주는 문구의 인덱스를 넣으면 가능하다. 물론 다른 코드도 있더라! 참고해볼것
65.[JS_오답노트]_팩토리얼_실습
let result라는 변수를 만들 생각을 안하니까 문제가 해결이 안되더라. result를 만들고나니 일사천리return 값은 함수마다 1번씩만 쓸수있고, 모든 조건문과 반복문이 끝나고 적는다.
66.[JS_오답노트]_거스름돈_실습
핵심은 나머지와 몫!
67.[JS_오답노트]_팰린드롬_실습
내장 메서드의 지식이 중요함을 알게 되었다.어렵지 않게 풀었다.다른 방식으로 푸는 근본적이 풀이법이 궁금하여 찾아보았다.
68.[JavaScript]_태그 선택 + 클릭 이벤트
getElementById vs querySelector / getElementsByClassName vs querySelectorAll
69.[JavaScript]_Window + console
참고자료window 객체대부분의 브라우저에 있는 개발자 도구는 console.log와 console.dir메소드를 지원합니다.두 메소드 모두 파라미터로 전달받은 값을 콘솔에 출력하는 역할을 합니다. 과연 이 둘은 어떤 차이가 있을까요? 이렇게 다양한 유형의 값들을 만들
70.[JavaScript]_DOM 트리 가족관계
참고자료DOM 트리 12가지 내용이 궁금하다면?(https://dom.spec.whatwg.org/배웠던 그대로 이 프로퍼티들은 노드 중에서도 '요소 노드'인 경우에만 존재하는 프로퍼티들입니다.그럼 요소 노드 말고 텍스트 노드에 접근하고 싶을 땐 어떻게 해야
71.[JavaScript]_요소 노드
textContent, outerHTML, innerHTML, / document.querySelector('#tomorrow'); / document.createElement('li'); / remove(); / today.append(tomorrow.children
72.[JavaScript]_HTML 속성 다루기
getAttribute, setAttribute, removeAttribute
73.[JavaScript]_Style 다루기
style 프로퍼티 / classname / classlist
74.[JavaScript]_비표준 속성
1. 선택자로 활용 / 2. 값을 표시할 태그를 구분할 때 활용 / 3. 스타일이나 데이터 변경에 활용 / dataset 프로퍼티와 data-* 사용
75.[JavaScript]_Browser, ElementNode, DOM, Attribute 총정리
Browser, ElementNode, DOM, Attribute 총정리!
76.[JavaScript]_Event handler 작동 과정 및 다양한 이벤트 종류
addEventListener, removeEventListener 사용하기
77.[JavaScript]_Event Object
event.target.style.color or event.target.classList.toggle('done') 등
78.[JavaScript]_Event Bubbling + Capturing
이벤트 버블링과 캡쳐링!
79.[JavaScript]_Event Delegation
e.target.classList.contains / e.target.tagName / e.stopPropagation 으로 조건과 제한을 걸어주기! / 이벤트 위임은 자식요소 에도 이벤트 설정을 인정해준다.
80.[JavaScript]_Event Limit(마우스 우클릭 제한)
event.preventDefault(); 가 마우스 우클릭 제한 하도록하게 만든 거였구만?!
81.[JavaScript]_이벤트 발생 총정리
이벤트 총정리!!
82.[JavaScript]_이벤트 관련 예제(청기백기)
함수괄호 안에 있는 e, event는 이벤트가 발생하면 알아서 기능을 한다는 의미니까 참고
83.[JavaScript]_마우스 이동 이벤트I
mousemove: 마우스 포인터가 이동할 때mouseover: 마우스 포인터가 요소 밖에서 안으로 이동할 때mouseout: 마우스 포인터가 요소 안에서 밖으로 이동할 때MouseEvent.clientX, clientY: 화면에 표시되는 창 기준 마우스 포인터 위치c
84.[JavaScript]_Class
JavaScript에서 클래스는 객체 지향 프로그래밍을 구현하는 데 사용되는 개념입니다. 클래스를 사용하여 객체를 생성하고, 속성과 메서드를 정의할 수 있습니다.클래스는 class 키워드를 사용하여 정의됩니다. 클래스 이름은 대문자로 시작하는 관례를 따릅니다.클래스 내
85.[JavaScript]_Contructor
\[](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor생성자(Constructor) 메서드는 클래스의 특별한 메서드로서 해당 클래스의 객체 인스턴스를 생성
86.[JavaScript]_Private class features
클래스 필드는 기본적으로 공개(public)이지만, 해시(비공개 멤버는 이 문법이 존재하기 전에는 언어 자체에 내장되어 있지 않았습니다. 프로토타입 상속에서는WeakMap객체나 클로저를 사용하여 동작을 흉내 낼 수 있지만,추가적인 문법 제약사항이 있습니다.클래스 내에서
87.[JavaScript]_Public class fields
공개(public) 필드는 쓰기 가능한(writable), 열거 가능한(enumerable), 구성 가능한(configurable) 속성입니다. 이러한 이유로 비공개(private) 필드와는 달리 프로토타입 상속에 참여합니다.추가적인 구문 제한 사항이 있습니다:정적 속