목록WEB STUDY/JAVASCRIPT (81)
whatisthis?
1. Window 객체 - 브라우저의 요소 / 자바스크립트 엔진 / 모든 변수를 담고 있는 객체. - 브라우저 전체를 담당하는 것 = Window 객체- 웹사이트만 담당하는 것 = Document 객체 (Document객체도 Window객체 안에 들어있음.) window객체 아래에는 많은 속성(property)과 메소드(method)가 존재함.그중에서도 대표적인 것을 살펴보면 * 객체 : screen , location , history , document 객체 * 메소드 : parseInt , isNaN 등 사실 parseInt같은 경우에도 window.parseInt()라고 작성하지 않고 parseInt()라고만 작성한다. Window 객체는 모든 객체의 조상, 즉 전역객체(global object)..
Callback 📌 함수(Function) 자바스크립트에서 함수는 일급객체이다. 일급 객체(first-class object)란, 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다. ▪ 변수에 할당(assignment)할 수 있다. ▪ 다른 함수를 인자(argument)로 전달받을 수 있다. ▪ 다른 함수의 결과로서 return 될 수 있다. ▪ 실행 도중에 생성될 수 있다. - 콜백함수는 이중에서도 '매개변수로 전달할 수 있다', 즉 '다른함수를 인자로 전달받을 수 있다' 는 특징을 이용. 📌 콜백함수(Callback) - 다른함수에 매개변수로 넘겨준 함수를 의미. - 매개변수로 넘겨받은 함수는 일단 넘겨받고, 나중에 호출(called back)한다는 의미. 즉, A함수의 인수..
배열에 관한 Method 1) 배열.length let array= [1, 2, 3, 4]; array.length; // 4 배열의 길이를 알려준다. 배열의 요소가 추가/제거 될 때 마다 자동으로 바뀐다. let array = [1, 2, 3, 4, 5]; array.length; // 5 array.pop(); // pop : 맨 끝의 요소를 제거 array.length; // 4 2) 배열.join(구분자) 배열의 항목들을 구분자를 기준으로 합친 새 문자열 반환. 구분자를 입력하지 않으면 자동으로 콤마(,)가 된다. let arr = [1, 2, 3]; arr.join(); // "1,2,3" ㅡ default : 콤마(,) arr.join(':'); // "1:2:3" 3) 배열.concat(합칠..
객체지향 프로그래밍(OOP) 컴퓨터 프로그램을 명령어의 목록으로 보는 시각에서 벗어나 여러 개의 독립된 단위, 즉 "객체"들의 모임으로 파악하고자 하는 것. 각각의 객체는 메시지를 주고받고, 데이터를 처리할 수 있다. - 유연하고 변경이 쉬움 >> 대규모 소프트웨어 개발에 사용. - 개발, 보수 용이 / 직관적인 코드 분석 가능. 📌 생성자 (Constructor) - new 연산자를 붙이고 객체를 함수처럼 호출하는 것. - 자바스크립트에는 class가 없으므로 그 역할을 대신함. - 생성자함수는 대문자로 시작 - this는 생성자 함수 자신을 가리킴. >> new로 객체를 만들 때 그 객체에 적용됨 function Person(name, gender) { // 생성자함수 (대문자로 시작) this.na..
생성자(constructor) Date객체를 new Date()로 만들듯이, new를 붙이고 객체를 함수처럼 호출 하는 것이 바로 생성자 함수이다. - 다른 언어에서는 class(클래스)가 존재하지만, 자바스크립트에서는 존재하지 않음. - ES2015 에서 클래스가 최초로 등장했지만, 다른 언어와는 다름. (겉만 클래스인 느낌. 그대로 프로토타입을 따름) ❕ 클래스 vs 프로토타입 자바스크립트에는 클래스라는 개념이 없고, 기존의 객체를 복사(cloning)하여 새로운 객체를 생성하는 프로토타입 기반의 언어이다. - 프로토타입 기반 언어는 객체의 원형인 프로토타입을 이용하여 새로운 객체를 생성함. - 그렇게 생성된 객체 역시 또 다른 객체의 원형이 될 수 있음. 📌 프로토타입 1) 프로토타입 객체를 참조하..
숫자(Number) - 숫자 또한 원시 래퍼 객체 (new Number()) 가 존재하고, 메소드를 가질 수 있다. 더보기 >> Wrapper Object 에 대한 내용은 아래 포스팅 참조. javaScript. 래퍼객체(Wrapper Object) 자바스크립트의 DataType에는 여러가지가 존재한다. 데이터타입은 크게 두가지로 구분할 수 있는데, 그것은 다음과 같다. 1) 원시 데이터타입(Primitive Data Type) number string boolean undefined null 2) 객체.. mywebproject.tistory.com let num1 = 0.1; let num2 = 0.2; num1 + num2; // 0.3000000000000004 컴퓨터는 소수를 2진법으로 바꿔 계..
자바스크립트의 DataType에는 여러가지가 존재한다. 데이터타입은 크게 두가지로 구분할 수 있는데, 그것은 다음과 같다. 1) 원시 데이터타입(Primitive Data Type) number string boolean undefined null 2) 객체형 데이터타입(Object Data Type) object array function date RegExp (정규표현식) 래퍼객체 (Wrapper Object) 이중에서 객체형 데이터타입은 메소드 등 객체 이용방법을 그대로 이용할 수 있다. 💡 래퍼객체 (Wrapper Object) - Number / String / Boolean - 원시형 타입을 (일시적으로) 객체화 시켜주는 객체형 데이터 타입을 의미함. >> 숫자, 문자열, Boolean 등 원..
문자열(String) - 작은따옴표('') 또는 큰따옴표("") - 백틱기호 (``) + 템플릿 ${} - 문자열도 객체이다. new String() /// object - 콘솔에 new String()이라고 치면 어떤 객체가 나온다. - 문자열은 객체이기 때문에 (정확히는, 원시 래퍼) 메소드가 존재한다. 📌 문자열에서 줄바꿈하는 방법 >> 아무리 문자열이 길더라도 '\n'을 넣어주지 않으면 한 줄로 인식됨. 여기서, '\n'을 개행문자라고 한다. (=탈출문자) 공백문자 NBSP (Non-Breaking Space) 줄바꿈 없는 공백 - 줄바꿈 방지를 위해 탈출문자(개행문자) Line Feed(LF) \n / 다음 줄로 넘어감 Carriage Return(CR) \r / 커서가 첫 문자로 돌아감 개행문..
🟨 console 객체의 메서드 - log - dir - count - time - timeEnd 📌 console.log() Web Console에 메시지를 출력하는 console.log는 객체 / 문자열 / 치환문자열 등을 출력할 수 있다. +) 로깅 디자인에 따라 info / warn / error 도 존재한다. ___ 📌 console.dir() 객체는 dir로 , 나머지는 log로 로깅하면 편하다. console.dir(document.body); >>> ❔ console.dir() 과의 차이점은 무엇일까? - DOM 요소들을 console로 보낼 떄 차이점이 있다. console.log - element를 HTML과 같은 트리구조로 출력. >> DOM요소에 대해 특별 처리 제공 - 객체를 로깅..
반복문 - 프로그래밍에서는 코드를 반복할 일이 많다. - 단순히 같은 코드를 반복하기도 하지만, 반복할 때마다 숫자를 1씩 더하는 등의 행동을 할 수도 있다. - 대표적으로 for과 while이 있다. 📌 For for (let i = 0; i < 10 ; i++) { console.log(i); } for (시작 ; 조건 ; 끝) { 내용 } 과 같이 구성되어있다. 시작은 let i =0 조건은 i < 10이고 끝은 i ++이다. 과정을 살펴보면 다음과 같다. 1) for문을 시작하기 전에 i = 0으로 시작한다. (i라는 변수를 만들고 0으로 초기화) 2) 조건 비교. i < 10을 만족하므로 내용 실행. (console.log) 3) 끝인 i++ 를 실행. ( i = i + 1 으로 i=1이 된다...