본문 바로가기

전체 글

(382)
Js 배열 //배열은 index를 나타내는 문자열을 property로 갖는다. //js배열에서 key=index다(=js에서 프라퍼티의 key는 index로 쓰일 수 있다) const arr=[7,8,9]; arr[3]="s" arr.x=4; console.dir(Object.getOwnPropertyDescriptors(arr)); console.log(arr); console.log(arr['2']);//배열은 index를 나타내는 문자열을 프라퍼티로 갖는다. console.log(arr[2]); console.log(arr['s']);//undefined; // console.log(arr[x]);//Error x is not defined; console.log(arr['x']);//Js에서는 이처럼 배열의..
리터럴 표기법에 의해 생성된 객체의 생성자 함수와 프로토타입에 대하여 자바스크립트 Deepdive p272에 관한 내용정리이다. 이책을 시작한 이후 처음으로 내게 절망을 준 단원이고 그만큼 결국엔 보람을 준 단원이다. 이 단원에서 배운 가장 큰 사실은 JS에서 function foo( ) { } 라는 함수선언문이 문맥에 따라서는 함수객체도 될수 있고 함수 리터럴이 될 수도 있다는 점이다. let obj={};//obj는 리터럴 표기법에 의해 생성된 객체로 Object생성자를 사용하지 않았지만 조사하면 그 결과는 Object생성자를 //사용하여 생성한 객체인 결과가 나온다. console.log(obj.constructor===Object);//true console.log(obj.__proto__===Object.prototype);//true console.log(obj..
프로토타입에 대하여 출처: https://poiemaweb.com/js-prototype#42-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EB%A1%9C-%EC%83%9D%EC%84%B1%EB%90%9C-%EA%B0%9D%EC%B2%B4%EC%9D%98-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85-%EC%B2%B4%EC%9D%B8 위글을 다시 복습하면서 유추하면서 읽어야 하는 중요한 사실 정리: 1. 생성자 함수에서 프로토입에 접근할 때는 prototype를 쓰고 그 생성자가 만든 객체에서 프로토타입에 접근 할 때는 __proto__를 사용한다. 생성자 함수.__proto__는 Function.prototype 이다. 2.[[Prototype]]..
왜 프론트앤드 라이브러리/프레임워크를 쓰고 React는 무엇인가 출처: https://velog.io/@gusdh2/React%EB%A5%BC-%EC%82%AC%EC%9A%A9%ED%95%98%EB%8A%94-%EC%9D%B4%EC%9C%A0%EB%8A%94-%EB%AD%98%EA%B9%8C 참고: https://www.youtube.com/watch?v=V3QsSrldHqI&t=333s 리엑트를 사용하는 이유중 하나가 싱글페이지(single page application)를 구현하기 위해서임. 리엑트는 복잡한 웹앱에서의 데이터와 화면의 불일치 문제를 해결해 준다. 따라서 전통적인 웹페이지(예를들면 어떤 정적인 문서를 보여주는 웹페이지)들에 굳이 리엑트를 사용할 필요는 없습니다. 이것이 아직 JQuery같은 프레임워크가 많이 쓰이는 이유입니다. 굳이 모든 웹사이트를 ..
[JavaScript] 전개 연산자 ( Spread Operator ) 출처: https://blog.naver.com/zoz0312/221622159150 전개 연산자는 배열 또는 객체를 하나하나 넘기는 용도로 사용된다. 코드를 통하여 확인하자 const arr = [1,2,3]; let test_arr = [4,5,6]; let test_arr2 = [4,5,6]; test_arr.push(arr); console.log(test_arr); //[4, 5, 6, [1, 2, 3]] //ES6 test_arr2.push(...arr); console.log(test_arr2); //[4, 5, 6, 1, 2, 3] push를 이용할 때 전개 연산자를 사용하지 않은 코드는 array 전체가 들어가 2차원 배열이 되었지만, 전개 연산자를 사용하게 되면 array 내부의 요소 ..
호이스팅과 var과 let의 차이점 그리고 let, const의 블록레벨스코프 출처: https://www.youtube.com/watch?v=F_NgVhvD5Ts&list=PLkNVwwEe58DjbNUHlD_fUOxUWlWYss1DV&index=7 글 일부내용의 출처: https://poiemaweb.com/es6-block-scope 호이스팅이란? var 선언문이나 function 선언문 등 모든 선언문이 해당 Scope의 선두로 옮겨진 것처럼 동작하는 특성을 말한다. 즉, 자바스크립트는 모든 선언문(var, let, const, function, function*, class)이 선언되기 이전에 참조 가능하다. 호이스팅에 의해 스크립트가 로딩되는 시점에 변수의 선언과 초기화를 undefined로 같이 시켜버린다. 값의 할당은 해당 라인에 가서 할당값으로 할당됨.(변수 호이스팅..
템플릿 리터럴: 백틱(``), 달러(${ }) 사용법 출처: https://curryyou.tistory.com/185 정리: 템플릿 리터럴=문자열표기법=문자열 생성시 따옴표 대신 백틱( ` )사용=템플릿 리터럴의 주요사용 문법은 벡틱과 달러연산인거 같다. 템플릿 리터럴의 기능. 1. 줄바꿈(개행) =백틱(`)을 사용하면 쉽게 줄바꿈됨. 2. 표현식 삽입 ${ } 사이에 변수나 연산 등을 삽입할 수 있게 되었다. (자바로 치면 %연산자 같은 거임ex%d, %s등등)
자스의 함수 출처: https://poiemaweb.com/js-function 출처: https://codingfarm.tistory.com/308 자바스크립트의 함수는 객체(일급 객체, First-class object)이다. 다른 객체와 구분될 수 있는 특징은 호출할 수 있다는 것이다. 함수도 객체이므로 다른 값들처럼 사용할 수 있다. 즉, 변수나 객체, 배열 등에 저장할 수 있고 다른 함수에 전달되는 인수로도 사용할 수 있으며 함수의 반환값이 될 수도 있다. 함수를 정의하는 방식은 3가지가 있다. 함수 선언문 함수 표현식 Function 생성자 함수 1.1 함수 선언문 함수 선언문(Function declaration) 방식으로 정의한 함수는 function 키워드와 이하의 내용으로 구성된다. 1.2 함수 표..