Javascript

[JavaScript] ES6 문법

작성자:
Featured image for [JavaScript] ES6 문법

1. Property Shorthand 객체를 정의할 때 객체의 key값과 value에 할당할 변수명이 같을 경우 value를 생략할 수 있다. 2. Concise Method 객체 내에서 좀 더 간결하게 메서드를 사용. 3. Destructuring Assignment 구조 분해 할당. 배열이나 객체에 입력된 값을 개별적인 변수에 할당하는 간편한 방식 제공. 4. Spread Syntax 반복 가능한(iterable) 객체에 적용할 수 있는 문법. 배열이나 문자열 … 더 읽기

[JavaScript] Ajax

작성자:
Featured image for [JavaScript] Ajax

1. Ajax 이를 통해 웹 페이지 전체를 다시 로드하지 않고도 페이지의 일부만을 업데이트할 수 있다. 가. 이용방법 여러가지 방법으로 비동기 통신을 할 수 있다. 2. XMLHttpRequest 코딩교육 티씨피스쿨 4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등 가. 객체 생성 자바스크립트를 이용하여 XMLHttpRequest 객체를 생성하는 방법. 나. readyState, status 프로퍼티 readyState 값 의미 설명 0 … 더 읽기

[JavaScript] XML, JSON, WebStorage

작성자:
Featured image for [JavaScript] XML, JSON, WebStorage

  1. XML, JSON 가. XML XML을 파싱하고 값을 읽어오는 방법이다. 파싱을 통해서 DOM만 생성하면 나머지는 HTML과 동일하다. 나. JSON 다른 프로그래밍 언어에서도 사용할 수 있다. MIME 타입은 application/json이다. 다. XML vs JSON JavaScript에서 동일한 데이터 기준으로 … 라. JSON method 2. Web Storage method description localStorage.setItem(key, value) key – value를 쌍으로 저장. localStorage.getItem(key) key에 … 더 읽기

[JavaScript] Array Method

작성자:
Featured image for [JavaScript] Array Method

Array – JavaScript | MDNMDN 메소드 설명 push() 배열의 끝에 요소 추가 pop() 배열의 마지막 요소 제거 shift() 배열의 첫 번째 요소 제거 unshift() 배열의 시작 부분에 요소 추가 splice() 배열의 요소를 삭제, 교체, 추가 slice() 배열의 일부를 새 배열로 반환 map() 배열의 각 요소에 함수를 적용한 새 배열 반환 filter() 함수의 테스트를 통과하는 요소로 … 더 읽기

[JavaScript] 리다이렉션, 새 창 열기

작성자:
Featured image for [JavaScript] 리다이렉션, 새 창 열기

1. Location 가. location.href location.href가 사용된다. 이를 통해 사용자는 현재 페이지의 URL을 알 수 있고, 필요한 경우 다른 페이지로 이동할 수 있다. 나. location.replace() location.replace() 메소드는 현재 문서를 새 URL로 대체한다. 이 메소드는 브라우저의 히스토리에 현재 페이지를 남기지 않는다. 즉, 뒤로 가기 버튼을 눌러도 원래 페이지로 돌아갈 수 없다. 다. location.href와 location.replace()의 차이점 브라우저의 히스토리에 … 더 읽기

[JavaScript] Event

작성자:
Featured image for [JavaScript] Event

1. Event 사용자와 웹 페이지 간의 상호작용이 있을 때 적절한 액션을 취한다. 가. 이벤트 유형 이벤트 이름 설명 click 사용자가 마우스 버튼을 클릭했을 때 발생 dblclick 사용자가 마우스 버튼을 빠르게 두 번 클릭했을 때 발생 mousedown 사용자가 마우스 버튼을 누르는 순간 발생 mouseup 사용자가 마우스 버튼을 눌렀다 뗄 때 발생 mouseover 마우스 포인터가 요소 위로 … 더 읽기

[JavaScript] FOR문

작성자:
Featured image for [JavaScript] FOR문

1. FOR문 4가지 방법이 있다. 가. for 특별할 것 없는 일반적인 for문이다. 나. for … in for…in은 객체의 모든 열거 가능한 속성을 순회한다. (이를 enumerable하다고 표현하더라…) 이는 객체의 속성 Key를 반환한다. 주로 객체의 속성을 순회할 때 사용된다. 배열에도 사용할 순 있지만 추천되지 않는다. 다. for … of for…of는 반복 가능한 객체(Array, Map, Set, String, arguments … 더 읽기

[JavaScript] 자료형, 함수

작성자:
Featured image for [JavaScript] 자료형, 함수

1. 자료형 Javascript에서 사용할 수 있는 자료형은 Primitive type과 객체(objects)가 있다. 2. Primitive type Primitive type은 Null, Undefined, Boolean, Number, String, BigInt, Symbol이 있다. 나머지는 모두 객체(objects)다. 가. Symbol Symbol은 ES6에서 도입된 새로운 Primitive type이다. 고유하고 변경 불가능한 값을 표현하기 위해 사용된다. Symbol은 객체 속성의 키로 사용될 때 유용하다. 각 Symbol이 고유하므로, 다른 속성 키와 … 더 읽기

[JavaScript] BOM, DOM

작성자:
Featured image for [JavaScript] BOM, DOM

1. BOM W3Schools.com 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. 객체 설명 screen 모니터의 정보 navigator 현재 실행 중인 브라우저의 정보 location URL의 정보 history 방문 기록에 대한 정보 document 문서에 대한 … 더 읽기

2022-08-22 JS_6

작성자:
Featured image for 2022-08-22 JS_6

객체예고 – 생활코딩 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 객체 자바스크립트의 객체에 대하여 알아본다. 객체의 예시로 자금까지 사용한 document도 객체에 속한다. 여타 언어와 크게 다르지 않다. 객체는 프로퍼티와 메서드를 포함하고 .(객체 접근 연산자)를 통해서 이것들에 접근할 수 있다. 객체 문법 가. 객체 선언 객체를 만드는 {}기호를 **객체 리터럴(object literal)**이라고 한다. 요소를 구분하기 위해서 … 더 읽기