배열의 구조 분해 할당   - 인덱스로 값을 하나하나 지정해서 넣어 줄 필요 없음- 만약 없는 값을 구조 분해 할당 할 경우 undefined가 출력됨    - 배열에 없는 값일 경우 " undefined"가 아닌 기본값을 출력하도록 할 수 있음- "four = 4" 이런식으로 구조분해할당할 때 기본값을 설정할 수 있음     객체의 구조 분해 할당  - 객체도 마찬가지로 {name : name} 이런식으로 하나하나 지정해줄 필요 없이- key 값을 활용해 구조분해할당을 할 수 있음- 단 key 값이 아닌 value 값이 구조분해할당되는 것을 주의하자     - 객체에 없는 값을 구조 분해 할당 하는 것도 가능함- 배열과 같이 기본값 설정도 가능함- 기본값 설정을 안하면 undefined가 콘솔에 출력됨..

단락 평가- 첫번째 피연산자 값 만으로도 논리 연산식의 결과를 확정지을 수 있기 때문에 두번째 피연산자의 값에는 접근조차 하지 않는 것을 단락평가라고 함   - AND의 경우 varA가 false이기 떄문에 varB를 확인하지 않고 단락평가가 발생해 false를 출력함- OR의 경우 varB가 true이기 때문에 varA를 확인하지 않고 단락 평가가 발생해 true를 출력함    실제 코드에서 살펴보기  - AND 연산의 상황에서 첫 피연산자인 returnFalse가 false이기 때문에- `console.log("False 함수")` 만 시행된 뒤 "false" 값이 반환됨 - returnTrue 는 아예 실행되지 않음     - AND 연산의 상황에서 첫 피연산자인 returnTrue가 true이기 ..

Truthy와 Falsy   - Javasciprt에서는 boolean이 아니어도 값을 참 거짓으로 평가함     -  즉, javascript의 모든 값은 Truthy하거나 Falsy 하다- 이를 이용해 조건문을 간결하게 만들 수 있다    Falsy한 값 7가지 - 0n : 아주 큰 값을 의미함(잘 사용 안함)- 빈 문자열은 False  Truthy한 값- 7개의 Falsy값을 제외한 나머지 모든 값 - 빈 배열, 객체, 함수도 True로 봄- 단, 빈 문자열은 False이니 주의    활용 사례   - 이렇게 빈 값이 들어와버리면 오류가 발생하면서 서버가 중단됨- 하지만 이런 오류는 자주 발생함     - 그래서 이렇게 조건문을 이용해 이런 상황을 방지할 수 있음- 하지만 null 값이 들어오면? ..

객체상수 객체(const)- 상수 객체에 또 다른 객체를 생성해서 할당하면 에러가 발생함    - 하지만 이렇게 추가 수정 삭제는 가능함 - 아예 새로운 값을 할당하는 것은 문제가 되지만- 저장되어있는 객체 값의 프로퍼티를 수정하는건 가능함     메서드 - 값이 함수인 속성을 메서드라고 함- sayHi가 메서드임- 호출할 땐 객체명.메서드명()    - 다른 함수와 똑같이 화살표 함수로도 표현 가능함- 메서드의 경우 우측처럼 화살표도 생략 가능함(이를 메서드 선언이라고 함)   - 메서드 호출법1. 객체명.메서드명()2. 객체명["메서드명"]()  - 메서드는 객체의 동작을 정의할 때 사용됨- 함수가 아닌 프로퍼티가 객체의 정보를 나타낸다면,- 함수 프로퍼티들은 메서드로서 객체의 동작을 정의함     ..

객체    객체 생성과 객체 속성 - {key : value} 형태- key의 개수에는 제한이 없음 단, 문자열과 숫자만 입력 가능함- value의 입력 값에는 제한이 없음(함수, 객체, 불리언 모두 가능)- 띄어쓰기가 포함된 값을 key값으로 사용할 때에는 " " 로 묶어줘야 함(ex) "my hobby"  객체 속성을 다루는 방법특정 속성에 접근 - name에 취소선 그어지는 것은 타입스크립트와 관련된 기능으로 vs코드의 기본 기능임(현재는 신경쓰지 않아도 됨)    3-1. 점 표기법 - 객체명.속성명- 존재하지 않는 값을 꺼내오려고 하면 오류가 발생하진 않고 "undefined"가 콘솔에 출력됨- 이걸 주의해야한다.. 띄어쓰기나 대소문자 오류, 콤마 하나도 다른 걸로 인식하기 때문에 변수명이 길고..

스코프(Scope)- 변수나 함수에 접근하거나 호출할 수 있는 범위   - 스코프 밖에서 호출하면 a 를 찾을 수 없다고 Error 가 발생함   - 아는 내용이지만.. 코드가 복잡해지면 스코프 때문에 실수하는 경우가 많기 때문에(경험담 ㅠㅠ) 한번 더 정리   전역 스코프와 지역 스코프 - 중괄호 안에 선언된 모든 변수들은 지역 스코프를 갖는다- if문 for문 모두 { } 안에 c,d가 선언되어 있기 때문에 전역 스코프 영역에서 이를 출력하려고 하면 에러가 발생한다- 즉 위의 코드에서 a만 전역스코프 / b, c, d는 모두 지역 스코프이다.   - 함수도 변수처럼 지역스코프를 갖는다- 그러므로 위에서 funcB를 외부에서 호출하면 "funcB is no defined" 오류가 발생한다   예외- 하..

콜백함수- 자신이 아닌 다른 함수에 인수로써 전달된 함수  - main의 인수로 sub 함수가 전달됨- 그렇기 때문에 main 내에서 매개변수를 호출하면 인수로 전달된 sub 함수가 호출됨  - 실행 결과 console.log("sub") 이 실행되어 콘솔 창에 sub이 출력된 것을 확인할 수 있음   - 이렇게 다른 함수에 인수로써 전달된 함수를 콜백함수라고 함 - 이전 함수에서 살펴봤던 것과 같이 호출이 아닌 매개변수 자체를 출력하면- 매개 변수 안에 담겨있는 함수가 그대로 출력되는 것을 확인할 수 있음   - 호출하면 sub 함수가 실행되어 콘솔에 "i am sub"이 출력됨  - 콜백함수는 메인함수가 원하는 언제든지 실행시킬 수 있다는 장점이 있어 많이 활용됨  - 이렇게 함수 표현식으로 쓰는 것..

지난번에 이어 인프런 - 한입 크기로 잘라먹는 리액트 강의 공부 내용이다강의를 통해 알려주는 것 외에도 헷갈리는게 많아서이것저것 직접 시도해보면서 정리해보았다   1. 함수 선언식 - 함수 자체를 변수에 담을 수 있음    - ( ) 를 열면 함수가 실행되기 때문에 콘솔에 "funcA 실행"이 출력됨   - varA에 변수를 담으면서 funcA( )가 실행되기 때문에 console에 "funcA 실행" 문구가 출력됨- funcA의 반환값이 없기 때문에 varA에는 값이 저장되지 않고 undefined가 출력됨   - 실행 안한 funcA 함수 자체를 varA에 담았고, varA를 호출'( )' 하면서 console에 "funcA 실행" 문구가 출력됨   - ( ) 즉, 실행하지 않으면 어떤것도 콘솔에 출..

책을 보고 공부하다가 속도도 너무 느리고 최신 업데이트가 반영 안된 것도 많아짧은 시간 효율적으로 공부하기 위해 결국 인프런 강의를 결제했다 강의는 이정환 선생님의 한 입 크기로 잘라먹는 리액트! 자바스크립트는 이미 많이 봐서 잘 알고있기 때문에 빠르게 보고 있는데,중요한 것들과 처음 보는 것들, 알아두면 좋을 만한 것들 위주로 정리해보았다  형변환number+string인 경우 parseInt 를 이용해 숫자로 형변환을 할 수 있음문자+숫자+문자인 경우엔 안되고 숫자가 먼저 나올 때만 가능함  연산자1. null 연산자null이 아닌 값을 출력함맨 아래 예제의 경우 userName이 undefined인 경우 userNickName이 출력됨앞의 값이 참이면 앞의 값이, 앞의 값이 null이나 undefi..

연산자할당 연산자오른쪽에 있는 피연산자의 평가 결과를 왼쪽 피연산자에 할당하는 연산자단축 연산자 지원 let a = 0 a+= 10 console.log(a) //10 a -= 3 console.log(a) // 7 a *= 10 console.log(a) // 70 a %= 7 console.log(a) // 0    증가 & 감소 연산자' +=' 또는 '-='와 같이 더 명시적인 표현으로 작성하는 것을 권장 증가 연산자 ('++')피연산자를 증가시키고 연산자의 위치에 따라 증가하기 전이나 후의 값을 반환 감소 연산자('--')피연산자를 감소시키고 연산자의 위치에 따라 감소하기 전이나 후의 값을 반환  let x = 3 const y = x++ console.log(x,y) // ..

데이터 타입 1. 원시 자료형(Primitive type)  Number, String, Boolean, null, undefined  변수에 값이 직접 저장되는 자료형  변수에 할당될 때 값이 복사됨  변수간에 서로 영향을 미치지 않음  const a = 'bar' console.log(a) // bar a.toUpperCase() console.log(a) // bar let a = 10 let b = a b = 20 console.log(a) // 10 console.log(b) // 20   2. 참조 자료형 (Reference type)    Objects(object,Array,Function)  객체의 주소가 저장되는 자료형(가변, 주소가 복..

1편, 2편에 이어 코딩애플님 AlertBox 만들기 3편(유튜브로는 6강의 내용)  React가 조금 더 부드럽고 여러가지 기능이 많기 때문에요즘은 jQuery를 잘 사용하지 않는다.  하지만 과거부터 현재까지 jQuery를 사용한 웹 사이트가 많이 남아있기 때문에눈에 익혀둘 겸 가볍게 공부했다!  전체 코드 안녕하세요   jQuery 설치법(CDN 이용) 구글에 jquery CDN 검색해서 3.x 에서 minified 버전 사용- uncompressed : 하나도 압축하지 않은 원본- minified : 공백 제거한 압축본느낌- slim : 몇몇 기능이 빠진 가벼운 버전- slim minified : slim + minified  요소 선택$('CSS셀렉..