JavaSrcipt
1.자바스크립트 기초 (1)
자바스크립트 기초 (1)
2.일단 만드는 자바스크립트 - (1) 로또 번호 추첨
🌈 로또 번호 추첨 기능 개발해보기 1부터 45까지 숫자(정수)를 뽑아보자✅
3.일단 만드는 자바스크립트 - (2) 자소서 글자수 계산기
자소설 글자수 세기 & 200자가 넘지 못하게 하기
4.일단 만드는 자바스크립트 - (3) 미니 스타크래프트
5.일단 만드는 자바스크립트 - (4) 기념일 계산기
기념일 계산기 만들어보자
6.프론트엔드 스쿨 5기 TIL - 3월 30일
잘 이해가 안되고 모르겠는건 고려대 교수님처럼 30번만 써보자... 🌈 BOM : 브라우저에 사용자의 데이터를 입력받을 수 있는 입력 창을 띄웁니다. prompt는 입력값이 숫자여도 문자열로 받습니다. console.log 꾸미기 : 콘솔창에 데이터를 테이블 형태로 제공합니다. 그룹화 시키고 위계를 만드는 🌈 변수 📌 포스트잇🗒처럼 가리키는...
7.프론트엔드 스쿨 5기 TIL - 3월 30일 (2) - string 메서드
string의 메서드
8.자바스크립트 기초 (2) - 객체 & 배열
객체 & 배열 기초 by 코딩앙마
9.프론트엔드 스쿨 5기 TIL - 4월 3일
number.. Math / isNaN ...etc
10.프론트엔드 스쿨 5기 TIL - 4월 4일 - Array (1)
배열
11.자바스크립트 중급 (1)
생성자 함수, etc... by 코딩앙마
12.프론트엔드 스쿨 5기 TIL - 4월 4일 - Object & function
🌈 Object 배열처럼 여러개의 데이터를 한 변수에 저장할 수 있는 자료형 객체는 특별한 키(key)를 통해 원하는 값(value)에 접근 할 수 있는 키-값 쌍으로 이루어져 있다 키 값 쌍을 합쳐서 속성(attribute)이라 표현. 만약 속성의 값이 함수인 경우에는 메소드라고 부릅니다. 🌈 function 파선아실(파라미터는 선언, 아규먼트는 ...
13.프론트엔드 스쿨 5기 TIL - 4월 6일 - 조건문
조건문, switch
14.프론트엔드 스쿨 5기 TIL - 4월 6일 - 반복문 (1) - for..in & for..of
🌈 반복문
15.프론트엔드 스쿨 5기 TIL - 4월 6일 - 반복문 (2) - while & 연습문제
while문 / 문자열 거꾸로 반환하기 / 팩토리얼
16.프론트엔드 스쿨 5기 TIL - 4월 6일 - continue / break
🌃 break 와 continue
17.프론트엔드 스쿨 5기 TIL - 4월 6일 - 전개구문 & 구조분해할당
전개구문, 구조분해할당
18.프론트엔드 스쿨 5기 TIL - 4월 10일 - DOM
DOM
19.프론트엔드 스쿨 5기 TIL - 4월 11일 - DOM (2)
🌈 DOM 🌃 .insertBefore 🌃 innerHTML / textContent / innerText 예제 1 : 노드의 텍스트 콘텐츠를 표현합니다. 컨텐츠를 단순히 텍스트로만 다룹니다. 더 자세하게 알고싶으면 https://velog.io/@kimunknown/JavaScript-Difftext 을 참고하자. 예제 2 🌃 Attrib...
20.프론트엔드 스쿨 5기 TIL - 4월 12일 - 함수 심화 - 스코프, 호이스팅
🌈 함수 함수는 선언되면 자바스크립트는 함수가 가진 코드를 일단 넘어가고 호출되면 그때 다시 돌아와 코드를 실행합니다! 🌃 특성 ✅아규먼트가 순서대로 들어가는 함수의 특성 ✅object 처럼 사용되는 함수의 특성 console.dir 을 이용해 함수의 length를 확인할 수 있다 🌃 roro 기법 심화 🌈 스코프 : 변수에 접근할 수 ...
21.DOM 선택자
NodeList 는 이터러블 객체로, 인덱스로 접근이 가능하며 for of문을 쓸수있다..length도 가넝합니다.둘다 이터러블 객체입니다.코딩앙마 dom 보는즁 아직 다 안봄 다시 보기
22.프론트엔드 스쿨 5기 TIL - 4월 11일 - DOM (3)
🌈 DOM 안에서 Node탐색 참고: https://lifeandit.tistory.com/70, https://hianna.tistory.com/712 태그를 표현하는 문자를 표현하는 주석을 표현하는 > previousSibling() > Element는 물론
23.클로저
클로저
24.프론트엔드 스쿨 5기 TIL - 4월 12일 - 생성자 함수, 콜백함수, Map
Map, 생성자 함수
25.프론트엔드 스쿨 5기 TIL - 4월 13일 - Set
Set은 모든 타입의 값을 저장하는 객체자료형의 한 종류입니다. 중요📌객체 안의 값은 중복을 허용❌
26.프론트엔드 스쿨 5기 TIL - 4월 13일 - this
this
27.프론트엔드 스쿨 5기 TIL - 4월 18일 - 이벤트 실습 - 셀렉트 박스 드롭다운 만들기
event 실습
28.프론트엔드 스쿨 5기 TIL - 4월 18일 - 이벤트 실습(2) - Todo 삭제
할 것 1. P 태그를 클릭하면 p 태그의 컨텐츠를 출력하는 alert 창을 띄워 2. 삭제 버튼을 클릭하면 삭제할 것인지를 물어보는 confirm 창을 띄워주고, 확인을 누르면 P태그를 삭제합니다. p를 가져오는 부분을 처음에 구현하지 못했다. 으로 구현할 수도 있다 을 통해 이벤트 전파를 막았다. 만약 을 if문 안에 넣었다면 confirm에 확...
29.Class
🎅 Class
30.상속, 프로토타입(Prototype)
🎅 상속, Prototype
31.AJAX
AJAX, fetch
32.Promise
Promise
33.자바스크립트로 SPA 만들기
const NEWSLIST_URL = 'https://api.hnpwa.com/v0/news/1.json'; const CONTENT_URL = 'https://api.hnpwa.com/v0/item/$id.json'; 그니까 내가만들어야할 화면이 이거임 
jQuery
35.class와 prototype
비슷한 object 만들때 class 만들어쓰세요. class는 object 뽑는 기계이다
36.this 키워드를 알아보자
console.log(this)를 하면, window 객체가 콘솔창에 나타납니다. this 키워드는 window 객체를 포함해서, 사용하는 환경에 따라 또 다른 뜻(?)을 가지게 됩니다.
37.this 키워드를 알아보자 2. event listener와 constructor
38.Arrow function - 화살표 함수
파라미터가 하나라면 소괄호 생략가능 / 중괄호 안에 return 한줄 뿐이라면 중괄호와 return도 생략가능합니다
39.ES6 - var let const와 선언,할당,범위
var > 재선언O 재할당O 범위 function let > 재선언X 재할당O 범위{ } const > 재선언X 재할당X 범위{ } const로 object 만들때 오브젝트 내부 값 변경해도 괜춘. 에러안남 만약 수정불가능한 오브젝트를 만들고 싶다면
40.Hoisting, 전역변수, 참조
변수와 함수의 선언을 변수 범위 맨위로 끌어지는 것 처럼 보이는 현상
41.Template literals, Tagged literal
템플릿 리터럴로 이루어진 문자를 해체할 수 있어요
42.괄호를 없애주는 Spread Operator , apply&call 함수
...붙이면 괄호를 제거해줍니다.
43.함수 default parameter & arguments
함수의 모든 파라미터들을 전부 한꺼번에 묶으려면 arguments
44.Rest 파라미터
모든 파라미터를[] array 안에 담아줍니다.
45.reference / primitive data type (화살표)
문자와 숫자는 Primitive data type으로 변수에 값이 그대로 저장이 됩니다.하지만, 값이 그대로 저장이 되지 않는 것들도 있어요. => reference data type
46.constructor 생성자 - Object 생성기계 - prototype까지
object를 마구 복사하고 싶을때 constructor을 사용합니당
47.class - 상속
class ES6부터 도입된 class는 constructor, prototype 을 이용한 상속기능을 간지나게 만들 수 있게 도와주는 문법입니다.
48.getter, setter
오브젝트 내의 함수들을 괄호없이 쓸 수 있게 만들어주는 키워드 set과 get
49.ES6 - Destructuring
key값과 value값이 동일하면 하나로 생략이 가능합니다.
50.ES6 Promise
프로미스는 성공/실패 판정 기계이다.
51.async / await
Promise가 어렵다면 ES8 async / await 알아봅시당 Promise와 then을 매우 쉽게 만들어주는 문법입니다
52.reduce 함수
https://www.zerocho.com/category/JavaScript/post/5acafb05f24445001b8d796d정리 굿
53.filter 함수