programming 49

[js] function

▶ 함수 (function) 다른 객체처럼 속성 및 method를 가질 수 있기에 일급(first-class) 객체이며 인자를 가질 수 있는 코드 블록이다 ▷ 함수를 사용하는 이유 프로그래밍에서 동일한 내용의 코드가 반복될 때가 있다 바로 이러한 코드 낭비를 없애기 위해 반복되는 코드를 하나의 함수로 정의하고 사용한다! 코드를 재사용할 수 있다 (한번 정의하고 여러 번 사용 가능하다) 다른 인자를 사용하여 동일한 코드를 여러번 사용할 수 있으며 다른 결과를 도출할 수 있다 1. 어떤 입력값을 주었을 때 (매개변수) 2. 어떠한 일을 수행하고 (본체) 3. 어떤 결과값을 돌려준다 (리턴값) 으로 함수를 작성하는 것이 일반적이다 ▷ 함수의 특징 변수 안에 담길 수 있다 (함수가 값이기에) 객체의 속성 안에 ..

[js] template literal

▶ template literal backstick(` `) 문자를 사용한 문자열 포맷팅이다 문자열 안에서 ${변수}, ${값} let myname = "홍길동"; let age = 25; console.log(`저의 이름은 ${myname}이고 나이는 ${age}입니다`); console.log(`welcome ${2000 + 22} years`); * 줄바꿈 가능하다 console.log(`안녕하세요 반갑습니다`); * template literal도 내부적으로 문자열 연결 연산(+) const myObject = {name : "John", age : 40}; const arr1 = [10, 20, 30]; console.log('myObject =', myObject); * 'myObject = ..

[js] null, undefined

▶ empty, null null은 의도적으로 변수에 값이 없다는 것을 명시할 때 사용한다 javascript는 대소문자를 구별하므로 null은 Null, NULL 등과 다르다 주의할 점! type을 나타내는 문자열을 반환하는 typeof 연산자로 null 값을 연산해보면 null이 아닌 object가 나온다. 이는 javascript 설계상의 오류이다! 따라서 null type을 확인할 때는 typeof가 아닌 === (일치 연산자) 를 사용해야 한다 x = {}; console.log(x, typeof(x)); // {} object x= null; console.log(x, typeof(x)); // null object ▶ undefined 선언 이후 값을 할당하지 않은 변수는 undefined ..

[js] object

▶ 객체(object) javascript는 객체 기반의 스크립트 언어이며 javascript를 이루고 있는 거의 모든 것은 객체이다. 객체란 여러 속성을 하나의 변수에 저장할 수 있도록 해주는 데이터 타입으로 key, value pair를 저장할 수 있는 구조이다 ▷ 객체 구문 var user = new user(); // "object constructor" syntax var user = {}; // "object literal" syntax var user = { name: "Surim Son", age: 22 }; ▷ 객체의 특징 객체는 변수이다. 그러나 객체에는 많은 값이 포함될 수 있다. 객체는 중괄호 표기를 이용하여 만들 수 있다 객체는 각각의 key/value에 대한 정보를 나열할 수 있..

[js] datatype (literal, string, number, array, object, null, undefined)

▶ 값을 갖고 있는 5개 타입 number : 숫자 타입 string : 문자열 타입 boolean : 논리 타입 (true, false) object : 객체 타입 function : 함수 타입 ▶ 6가지 object 타입 object : 객체 array : 배열 date string number boolean ▶ 값을 갖고 있지 않은 타입 2가지 undefined : 타입이 지정되지 않음 nul : 데이터가 없는 object * js는 dynamic type을 지원하는 언어이다. 그 때 그 때 타입이 변하는 언어! ▶ 리터럴 (literal) @ 리터럴 이해하기 : https://tiboy.tistory.com/685 리터럴은 변수의 형(type)을 정한다. 변수 초기화에 종종 사용된다. let s ..

[js] operator

▶ 연산자 연산 : operation 연산자 : operator 피연산자 : operand ▷ 대입 연산자 (assigment operator) : = 등호(=) 오른쪽의 값을 왼쪽에 대입한다 ▷ 산술 연산자 (arithmetic operator) +, -, *, / : 사칙 연산 % : 나머지 연산자 (remainder) ** : 제곱 연산자 (exponential) - % : 실수 연산 결과는 정밀도에 한계가 있다 꼭 기억 별표!! console.log(12.1 % 3); //0.09999999999999964 [두 변수 값을 바꾸는 방법] num3 = 100; num4 = 200; let temp; // 방법 1 temp = num3; num3 = num4; num4 = temp; // 방법 2 /..

[js] variable

▶ 변수 (variable) 값(데이터)을 담는 공간이다. 프로그램에서 사용되는 데이터를 일정 기간동안 기억하며 필요한 때에 다시 사용하기 위해 데이터에 고유의 이름인 식별자를 명시하는 것이다 변수로 선언 이름(variable name)을 부여해서 관리한다 변수는 사용하기 전에 먼저 '선언(declaration)' 해야 한다 ● 식별자 : 어떤 대상을 유일하게 식별할 수 있는 이름이다 ● 변수명 : 변수에 명시한 고유한 식별자 ● 변수값 : 변수로 참조할 수 있는 데이터 값 ▷ javascript에서의 변수 javascript는 동적 타입의 언어이기에 변수의 타입 지정 없이 값이 할당되는 과정에서 자동으로 변수의 타입이 결정된다 즉, 변수는 고정된 타입이 없으면 같은 변수에 여러 타입의 값을 자유롭게 할..

[JS] version

javascript 최초 개발 : 1994. (구) 넷스케이프 커뮤니케이션 당시 넷스케이프 브라우자에서 기존의 정적인 HTML 페이지에 동적인 기능을 가능하게 하기 위해 script 언어로서 개발한다 개발자는 '브렌던 아이크(brenden eich)' 이다 현재 운영 : 모질라 재단 상표권자 : 오라클 스크립트 표준 : ECMAScript (에크마 스크립트) 위 javascript를 기반으로 만든 범용 스크립트 언어 표준안으로 ECMA-262로 제정된다 언어가 준수해야 할 규칙, 세부사항을 규정한다 javascript의 버전으로 이해해도 된다 ECMA : ecma international. 정보와 통신시스템을 위한 국제적 표준화 기구이다

[jQuery] AJAX 아직 덜 함

jQuery를 사용하는 중요한 이유 중 하나는?! AJAX를 브라우저 호환성 고민하지 않고 간편히 구현할 수 있기 때문이다 실제 javascript만으로 AJAX를 구현할 경우 브라우저 특성별 코드들을 만드는 등 복잡한 과정이 많은데 jQuery는 이를 간편화! load() 함수 $(selector).load(URL, data, callback); 서버로부터 데이터를 읽어와서 select된 element에 넣는다 URL : request할 url data : 쿼리스트링에 해당하는 데이터 (key-value 쌍으로 이루어진다) - post() 일 경우 해당한다 callback : load() 완료 후 수행할 함수 responseTxt - ajax request 성공하면 받는 내용 statusTxt - aj..

programming/JS 2022.08.30

[jQuery] filter

이미 select된 element에 대해 추가적으로 또 select(필터링)하는 함수 배열처럼 인덱스(index), 요소의 속성값으로 선택하는 함수도 있다 ~ .first() : ~의 첫번째 요소만 선택 $('~:first')와 동일한 결과가 나온다 ~ .last() : ~의 마지막 요소만 선택 $('~:last')와 동일한 결과가 나온다 ~ .eq(i) : ~의 i번째 요소만 선택 $('~:eq(i)')와 동일한 결과가 나온다 -> 슈도클래스에도 동일한 것 있다 ~ .filter(selector) : ~ 중 selector 지정 요소만 선택 ~ .filter(callback) : ~ 중 callback 결과가 '참' 인 것만 선택 ~ .not(selector) : ~ 중 selecotr 지정 요소를 제..

programming/JS 2022.08.27