Java Script

Java Script/deepDive

44. Promise

1. 비동기 작업을 수행하는 것 : setTime, setInterver, request, event(load) -> 비동기 작업 사용 이유 : 하나의 작업을 기다리지 않고 동시 다발적으로 작업을 수행하기 위함 2. 비동기 작업의 결과를 사용하기 위해서 call back 함수를 이용한다. -> call back 함수가 없는 비동기 특성상 언제 함수가 종료 될 지 모르기 때문에 ' 비동기 함수 ' 와 ' 비동기 함수 "내부의 진짜 비동기 함수" ' 가 수행 될 경우 비동기 함수가 먼저 종료 되고, 나중에 비동기 함수 내부의 진짜 비동기 함수가 마무리 된다. -> call back 함수가 존재시, 매개변수에 외부함수를 넣기 때문에 비동기 결과를 가져 올 수 있다. 3. 콜백함수의 2가지 단점을 해결하기 위해..

Java Script

videoRate controll

video 영상 속도가 최대 2x까지 있는게 마음에 들지 않았다. html 값을 변경하는 것으로도 작동할 수 있지만 , 만약 작동하지 않는다면 JS로 event를 발생 시켜야한다. 아래는 JS를 이용해 배속을 원하는 속도로 지정하는 코드이다. // 해당 video 동작하는 console 창에서 작동시키기 // 1. HTML5 비디오 요소 가져오기 const video = document.querySelector('video'); // 2. 비디오 플레이어 속성 가져오기 const playbackRate = video.playbackRate; // 3. 비디오 플레이어 속도 설정하기 video.playbackRate = 2.0; // 2배속

Java Script

5. 표현식과 문

1. 값 식(표현식)이 평가되어 생성된 결과 평가: 식을 해석해서 값을 생성 혹은 참조하는 것 // 10 + 20은 평가되어 숫자 값 30을 생성 10 + 20; // 30 모든 값은 data type을 가지며 메모리에 저장된다. 현재는 값이 저장되었지만 변수가 없기에 재사용이 불가 2. 리터럴 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법 리터럴의 종류 정수, 부동소수점 2진수, 8진수, 16진수 문자열 불리언 null, undefined 객체, 배열, 함수 정규식 3. 표현식 값으로 평가될 수 있는 문 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조 예 값을 생성 기존 값 참조 // 표현식 : 100 // 100은 js engine에 의해 평가되어 값을 생성하므..

Java Script/deepDive

4. 변수

변수가 존재하지 않을 시, 값은 메모리 주소에 저장된다. 메모리 주소를 통해 값에 직접 전근하려는 시도는 올바른 방법이 아니다. 변수 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름 값의 위치를 가리키는 상징적인 이름 1. 식별자 변수 이름을 식별자라고 한다. 식별자는 값이 아니라 메모리 주소를 기억하고 있다. 변수, 함수, 클래스 등의 이름은 모두 식별자이다. 위의 이름과 같은 식별자는 네이밍 규칙을 준수해야한다. 선언에 의해 JS에 식별자의 존재를 알린다. 2. 변수 선언 변수 선언 변수를 생성하는 것 var, let, const 키워드 사용 JS engine에서 변수 선언 2 step 선언 단계: JS에 변수의 존재를 알림 초기화 단계 : unde..

Java Script/deepDive

01,02,03 프로그래밍, 자바스크립트란, 자바스크립트 개발 환경과 실행 방법

1. 프로그래밍, 2. 자바스크립트란 컴퓨처가 이해할 수 있는 기계어로 변환하는 일종의 번역기 번역기 컴파일러 인터프리터 컴파일 언어 인터프리터 언어 코드가 실행되기 전 단계인 컴파일 타임에 소스코드 전체를 한번에 머시 코드로 변환한 후 실행 코드가 실행되는 단계인 런타임에 문 단위로 한 줄씩 중간코드인 바이트코드로 변환한 후 실행 실행 파일을 생성 실행 파일 생성 안함 컴파일 단계와 실행 단계가 분리, 명시적인 컴파일 단계를 거치고 명시적으로 실행 파일을 실행 인터프리트 단계와 실행 단계가 분리 안됨 인터프리터는 한 줄씩 바이트코드로 변환하고 즉시 실행 실행에 앞서 컴파일은 단 한번 수행 코드가 실행될 때마다 인터프리트 과정이 반복 수행 컴파일과 실행 단계가 분리되어 있으므로 코드 실행 속도가 빠르다 ..

Java Script/JS 핵심

6. JS 핵심 - 객체

1. 객체 생성 종류 2가지 빈 객체 생성한 후, 멤버(속성, 함수) 추가 객체의 생성과 동시에 멤버 추가 // 1. 객체의 생성방법 const person = {}; // property 추가 person.firstName = "join"; console.log(typeof person); // object // 2. 객체 생성 + 초기화 const myObject = { firstName: "join", }; console.log(typeof myObject); // object 2. 생성자로 객체 생성 생성자를 정의하면 객체를 편리하게 생성 해당 객체 호출시 객체 이름 { property, function} 출력 하지만 type은 object 주의 생성자라고 해도 결국에는 function일 뿐이다...

Java Script/JS 핵심

5. JS 핵심 - 함수

1. 함수의 선언과 함수 표현식 함수는 항상 값을 반환한다. return 값이 없더라도 undefiend를 반환한다. 함수 표현식 : 함수 앞에 변수 붙여주는 것 람다식 IIFE : 즉시 호출 함수 표현식 - 람다식과 유사, 일회용 // 1. 함수 선언 function add1(a, b) { return a + b; } console.log(add1(1, 2)); // 2. 함수 표현식 var add2 = function (a, b) { return a + b; }; console.log(add2(3, 4)); // 3.lambda식 // sort() comparator 했던 것 // 4. IIFE console.log( (function (a, b) { return a + b; })(5, 6) ); 2..

Java Script/JS 핵심

4. JS 핵심 - 조건문, 반복문

자바와 거의 동일 향상된 for문 생김새 다름 switch문 조건식, case 문 비교 === 사용 while() 조건식 for for(a of b) : 향상된 for문 - 이걸 자주 사용 for(var x in b) : b 객체 property 값 출력 // for of const array1 = ["a", "b", "c"]; for (const element of array1) { console.log(element); } // for in var person = { fname: "woo", lname: "wee", age: 25 }; for (const key in person) { if (Object.hasOwnProperty.call(person, key)) { console.log("key: ..

wooweee
'Java Script' 카테고리의 글 목록