FE/JavaScript(18)
-
[JavaScript] BOM, DOM
1. BOM JavaScript Window W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com BOM : Browser Object Model : 브라우저 객체 모델 : 웹 브라우저와 관련된 모든 객체들의 집합. 객체 설명 screen 모니터의 정보 navigator 현재 실행 중인 브라우저의 정보 location URL의 정보 history 방문 기록에 대한 정보 docu..
2024.01.14 -
[JavaScript] destructuring operator
1. destructuring operator var obj={ "a":2, "b":3 } let {a,b}=obj; console.log(a,b); //출력 2 3 What does this javascript syntax means: const { headers, method, url } = request; It's not clear what this syntax means const { headers, method, url } = request; found in this tut https://nodejs.org/en/docs/guides/anatomy-of-an-http-transaction/ stackoverflow.com
2023.03.27 -
[Javascript] async & await
0. 참고자료 1. async async function - JavaScript | MDN async function 선언은 AsyncFunction객체를 반환하는 하나의 비동기 함수를 정의합니다. 비동기 함수는 이벤트 루프를 통해 비동기적으로 작동하는 함수로, 암시적으로 Promise를 사용하여 결과를 반환 developer.mozilla.org async function 선언은 AsyncFunction객체를 반환하는 하나의 비동기 함수를 정의합니다. 비동기 함수는 이벤트 루프를 통해 비동기적으로 작동하는 함수로, 암시적으로 Promise를 사용하여 결과를 반환합니다. (출력값이 Promise 객체다.) 그러나 비동기 함수를 사용하는 코드의 구문과 구조는, 표준 동기 함수를 사용하는 것과 많이 비슷합니..
2023.03.01 -
[JavaScript] var과 let
1. 결론 생활코딩 강의를 봅시다. (https://youtu.be/61iolhWgQt0) 생활코딩 유튜브 결론은 var보단 let을, 가능하다면 const를 사용하자. 2. 이유 var let const var let const global O X X script scope X O O function local scope O O O block scope X O O 재선언 O X X 재할당 O O X const는 값을 재할당 할 수 없다. 이를 제외하면 let과 동일하게 작동한다. 중요한 것은 var과 let의 차이다. 우선 var을 사용하면 다음과 같은 문제가 생긴다. 재할당이 가능하다. block scope를 무시한다. script scope를 무시한다. a. 재할당이 가능하다. var은 재할당이 가..
2023.02.10 -
2022-08-22 JS_6
객체예고 - 생활코딩 소스코드 변경사항 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 객체 자바스크립트의 객체에 대하여 알아본다. 객체의 예시로 자금까지 사용한 document도 객체에 속한다. 여타 언어와 크게 다르지 않다. 객체는 프로퍼티와 메서드를 포함하고 .(객체 접근 연산자)를 통해서 이것들에 접근할 수 있다. 객체 문법 가. 객체 선언 객체를 만드는 {}기호를 객체 리터럴(object literal)이라고 한다. 요소를 구분하기 위해서 , 콤마를 사용한다. 나. 객체 프로퍼티 추가하기 coworkers.subject = "JavaScript"; 간혹 key에 공백을 포함한 경우가 있다. 이때 coworkers.prior knowledge = “..
2022.08.22 -
2022-08-18 JS_5 (배열, 반복문, 콘솔, 함수)
배열과 반복문의 활용 - 생활코딩 소스코드 변경사항 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 1. 배열과 반복문 정통적으로 배열과 반복문은 같이 사용되는 경우가 많다. 가. 실습 : 리스트 작성 Loop & Array count one two three four 같은 효과를 내는 더 효율적인 방법이 있다. ... one two three four ... 해당 코드를 배열과 반복문을 이용해서 대체하면 유지보수 측면, 중복 최소화, 가족성 측면에서 유리하다. ... ... 배열의 크기만큼 배열의 값을 리스트로 작성한다. Loop & Array count 2. 콘솔 개발자 도구를 잘 다루면 편하다. 우클릭 → ‘검사’ 클릭 → ‘console’ 콘솔창을 ..
2022.08.19 -
2022-08-16 JS_4
배열 - 생활코딩 소스코드 변경사항 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 배열 배열 선언 ... ... 배열에 값을 추가하는 법 ... ... Array - JavaScript | MDN JavaScript Array 클래스는 리스트 형태의 고수준 객체인 배열을 생성할 때 사용하는 전역 객체입니다. developer.mozilla.org push() 외에도 pop() , shift() , unshifth() 등의 기능도 제공한다. pop() : 가장 뒤에 값을 반환하고 삭제 그리고 전체 길이는 줄어듬. shift() : 가장 앞에 값을 반환하고 삭제 그리고 순서를 한 칸씩 앞으로 당김. unshift() : 가장 앞에 값을 추가하고 그리고 순서를..
2022.08.17 -
2022-08-14 JS_3
변수와 대입 연산자 - 생활코딩 변수와 대입 연산자 2017-12-01 03:26:24 opentutorials.org 이 글은 이고잉님의 오픈튜토리 강의를 듣고 정리한 내용입니다. JS 학습의 방향성 이미 파이썬, C, Java를 배웠다. 이 짬(?)을 바탕으로 빠르게 JavaScript를 배워보겠다? 배경지식을 바탕으로 부족하거나 새로운 지식만 짚고 넘어갈 것이다. 제어할 태그 선택하기 버튼 2개를 생성했다. night 버튼을 누르면 배경은 어둡게, 글자는 밝게 만들고 싶다. 또 day는 그 반대로 기능하도록 만들고 싶다. WEB Html 코드다. input 태그에 onclick 속성을 추가한다. 클릭 이벤트가 발생한 경우 실행할 JavaScript 코드를 추가한다. 설명은 아래에. document...
2022.08.16