본문 바로가기

1.웹개발/JS

 (10)
[JS]Bom Bom Bom Bom이 왔네요 아이가 처음 배우고 하는 말 "엄마", "아빠" 개발자들의 엄마, 아빠 "Hello Wolrd!" JS로 Hello Wolrd를 출력하는 코드는 다음과 같습니다. html에 추가 개발자 또는 지망생들은 코드를 보고 console.log라는 것으로 출력을 한다고 추측할 수 있을 텐데요 여기 console은 어디서 나왔을까요? Browser(브라우저)에는 전역 객체(window)라는 것이 있습니다. 전역 객체는(this나 var키워드와 연관이 있습니다) this란? https://hbsowo58.tistory.com/150 [JS]this,바인딩,this결정조건 this란, 자바스크립트에서 자기 참조 변수입니다. 객체에서 '자신의' 프로퍼티나 메서드를 참조하기 위한 자기 참조 변수입니다. (저라는 사람은 1..
[JS]비동기 프로그래밍 결론 : 동기 프로그래밍은 동시에 발생하는 것이 아니다. 목표 : JS에서 비동기 프로그래밍의 이해 비동기 프로그래밍에 대해서 학습해보도록 하겠습니다. 목차 비+동기란? 1-1 동기 1-2 비동기 1-3 동기, 비동기 예시 1-4 비동기의 방법과 단점(1) callback 1-5 비동기의 방법 (2) promise 1-6 비동기의 방법 (3) async / await 비동기 방식을 이용한 통신방법 2-1 Ajax 2-2 XMLHttpRquest 2-3 fetch 2-4 axios 비동기란? 비동기란, 非(아닐 비) 자를 사용하여, "동기가 아니다"라는 뜻입니다. 비동기를 알기위해선, 동기가 무엇인지 알아야 합니다. 동기가 아닌 것이 비동기 이니까요. 동기 그렇다면 동기(Synchronous)란? 同氣(같..
[JS] 배열 for ... of 문 변수하나에, 다양한 값을 저장하기 위한 방법중 1가지는 배열이 있습니다. 자바스크립트에서 배열은 사실은 obejct입니다. 여기서는 이내용을 다룰 것은 아니며 순회 방법중 1가지를 알아보겠습니다. 자바스크립트 배열의 순회방법에는 for ... of 문법이 있습니다. 아래와 같은 배열이 존재할때, const numbers = [1,2,3,4,5] 조건에 따라 순회시켜, 필요한 데이터만 출력해보도록 하겠습니다. 1. 기본적으로 배열 전체 조회 //기존 for문 const numbers = [1,2,3,4,5] for (let i = 0; i < numbers.length; i++){ console.log(i) } //for ... of 문 for (const number of numbers) { consol..
변수와 메모리 적재 과정 변수는 왜 필요할까요? 다음과 같은 코드가 있다고 가정합니다 console.log(1) console.log('heo') console api의 log 메서드를 통해, 1과 heo를 출력하였습니다. 문제는, 이를 '재사용'할때 발생합니다 1을 재사용 해서 출력할 경우 아래와 같이 될 것 입니다. console.log(1) console.log(1) console.log(1) 큰 문제는 없어보이는데, 모든 1에 2를 더해야 한다고 가정한다면 console.log(1+2) console.log(1+2) console.log(1+2) 이렇게 바뀔 것이며 나아가 이런 작업을 무한대로 반복한다면? 반복 작업을 많이 수행할 것 입니다. 또한, '특정' 1만 선택해서 3을 더한다면? "어떤"기준으로 1을 선택할 수 ..
for문의 동작순서 목적 : for문의 동작 순서 이해 및 자바스크립트에서 키워드 스코프 이해 다양한 프로그래밍 언어에서 반복 문의 종류에 for 문이 있습니다. 아래와 같은 코드가 존재한다고 가정하면, 동작 순서는 for(let i = 0; i ㄷ -> ㄴ -> ㄹ -> ㄷ -> ㄴ -> (종료) i는 3전까지만 된다고 생각할 수 있는데, i가 3까지 증가하나, 조건문에서 false가 되어 실행 문의 실행되..
var와 let/const의 차이 핵심은 "var의 단점을 알고 있는가?"라고 생각합니다. 나아가, 호이스팅에서의 차이를 알고 있느냐를 묻는다고 생각합니다. var, let , const는 '변수'를 선언하기 위한 키워드입니다 변수에 대한 필요성 등은 프로그래밍 공부 시 처음 배우는 내용입니다.(중요) var키워드의 단점은 1. 암묵적 결합(중복 선언 가능) 2. 생략 가능 3. 변수 호이스팅 4. 함수 레벨 스코프 등 단점들이 있습니다. let은 이러한 단점을 해결해서 es6에서 출시된 키워드라고 이해하면 됩니다. 하나씩 보겠습니다. 1. 암묵적 결합(중복 선언 가능) (function() { var variable = 'hi i am var keyword'; var variable = 'Redundancy declaration'; c..
[JS] 자바스크립트 ES5 ES6 차이 질문 의도 : ES5와 ES6의 차이를 알고 있는가, 과거 버전은 왜 알아야 하는가?라고 판단 글의 목적 : ES5와 ES6의 차이 이해 및 과거 버전에 이해 필요성 납득 취업시장에서 ES6+를 요구하고 있습니다. 그럼에도, 과거 버전을 알아야 하는 이유는 1. 레거시 코드(누군가 남기고 간 기존 코드)를 최신 문법으로 리팩토링 할 수 있는가? 2. 구글링한 코드의 동작을 해석해서 유지 보수할 수 있는가? 모든 회사가 최신 문법을 사용하진 않기 때문이며, 최신 문법을 사용하더라도 시간이 지나면 레거시 코드가 되기 때문입니다. ES5, ES6 구분이 필요한 이유는, 버전 차이에 따른 기능 추가가 뚜렷했기 때문입니다. ES란, ECMASCRIPT의 약어 뜻하며 자바스크립트의 표준, 규격을 나타내는 용어입니다..
[JS] 019-017이 4인 이유 앞에 0이라는 접두사가 붙으면, 8진수 0x는 16진수 선수 지식이 필요하다. 017을 해석해보자면, 0(8진수) 17이다. 이는 이진수로는 001 111, 십진수로는 15로 변환, 019은 0(8진수)로 19을 바꾸려고 하는데, 9은 8진수로 표현할 수 있는 범위를 넘어섰다. 그 다음 표현할 수 있는 십진수 19로 변환된다고 추측한다 (2진수, 8진수,10진수 16진수 순서대로) 019-017은 십진수로는 19-15라서 4이 되는 것이다. 018 역시 표현할 수 없기 때문에 십진수 18이나, 020은 010 000, 십진수 16으로 변환된다. 028은 십진수 28로 표현된다. 결론 진법에 대한 이해가 필요하다. x 진법 자릿값은 x-1까지만 올 수 있다. (진법의 정의) 018, 019는 십진수로 18..

티스토리툴바