목록분류 전체보기 (433)
whatisthis?
1. 연산자 - 프로그래밍에서 쓰이는 기호들. 📌 산술 연산자 사칙연산. (=arithmetic operation) + , - , * , / 그리고 나머지연산자(%) Addition / Subtraction / Multiplication / Division / Mod(Moudlus) ❗ /는 그냥 나누기 (몫 아님). 즉, 5 / 2 = 2.5 ❗ +를 제외한 나머지(-와 *와 /)는 "3" 과 "2"처럼 문자열로 표현된 숫자의 계산도 해줌. >> + 연산자는 "2"+"3" = '23' 이 됨. 📌 문자열 연산자 + 연산자. 숫자 뿐만 아니라 문자열과 다른 데이터를 연결해줌. >> 문자열이 아닌 데이터(예- 숫자)는 문자열로 바꾸어 연결. ❗ 왼쪽부터 계산되고, 문자열이 있을 경우 문자열이 우선이다. c..
1. 함수(Function) 📌 함수의 생성 방법 1 / 함수 선언 (Declaration) function addOne(x) { var y = x + 1; return y; } 방법 2 / 함수 표현식 (Expression) let addOne = function(x){ // 변수 선언 후 함수 대입 var y = x + 1; return y; }; 여기서 addOne은 함수의 이름(=변수의 이름)이고, x는 사용자가 넣고싶은 값을 넣는 곳이다. 따라서, x를 매개변수(parameter)라고 한다. return은 해당 값을 함수 바깥으로 내보내고, 함수를 종료하라는 의미이다. (= 반환) ❗❗ 주의 - return의 위치 위 두 방식의 차이 중 하나는 호이스팅(hoisting)이라는 현상인데, 해당 내..
1. 객체 (Object) - 현실의 사물을 프로그래밍에 반영한 것. 예> 현실에 존재하는 유저를 객체를 통해 프로그래밍에 반영할 수 있다. let user = { Name: 'yjin', Age: 23, Tel: '010-0000-0000', Gender: 'Female' }; 위와 같이 user라는 변수에 { } 로 감싼 덩어리를 대입한 것을 알수 있다. { }로 감싼 덩어리가 바로 객체(object)에 해당한다. 객체의 부분별 이름을 살펴보자. 📌 속성 (Property) Name: 'yjin' , Age: 23 과 같이 콤마(,)로 구분되는 것을 객체의 속성(Property)이라고 한다. - 위 예시에는 총 4개의 속성이 존재하는 것. 속성끼리는 쉼표로 구분해준다. 꼭 줄바꿈을 해야하는 것은 아니..
💡 자바스크립트 - 창시자 : 브렌던 아이크 - 절차형, 객체지향형, 함수형 언어를 모두 아우를 수 있다. - 인터넷 브라우저만을 통해 구현 가능. (F12 개발자도구 - console) 1. 변수 (variable) const dateChecker = function() { // 변수1. 함수(함수 선언/코드 저장) let date = new Date(); // 변수2. value(날짜값 저장) alert(date); } dateChecker(); 이전에는 var으로 변수를 선언하는 방법밖에 없었지만, ECMAscript 6(이하 ES2015) 이후로 const와 let이 등장하면서 이제는 var을 거의 사용하지 않게 되었다. 📌 변수(variable)란? 변수란, '변하는 수' 를 의미한다. = 데이..
CMD(명령 프롬프트)나 gitBash, git GUI 등을 이용. - 명령어는 같다! ___ C:/ gitExample 폴더를 만들고, 폴더 안에 index.html과 style.css를 만든다. 1. cmd창으로 자신의 프로젝트 폴더 위치로 이동한다. cd [경로] = change directory. 2. git init 를 입력 - Initialized empty Git repository in [경로] >> 프로젝트 폴더 안에 .git이라는 숨겨진 폴더가 생성됨. 3. git status 입력 현재 파일들의 상태 확인 가능. - On branch master : 현재 branch(=가지) 는 master. - Initial commit : commit을 해야만 Git에 파일이 저장됨. - inde..
객체를 생성하기 위한 Template. class도 함수와 마찬가지로 Class표현식과 Class선언 두가지 방법이 존재. - 함수표현식 vs 함수선언 비교 javaScript. 함수선언식 vs. 함수표현식 함수 선언 방식 = 함수가 독립된 구문 형태로 존재. 함수 표현식 방식 = 함수가 표현식의 일부로 존재. 함수선언식 (function Declaration) - 지정된 매개변수(parameter)를 갖는 함수를 정의 SYNTAX fun mywebproject.tistory.com 1 / 클래스 선언 class Rectangle { constructor(height, width) { this.height = height; this.width = width; } } - class 키워드 + 클래스명 (R..
클래스 객체를 만들어 내기 위한 설계도(Template) 또는 틀. 연관되어 있는 변수와 메서드의 집합. 객체 소프트웨어를 통해 구현할 '대상'이 되는 것. 클래스에 선언된 모양 그대로 생성됨. ** 클래스의 instance = 객체(Object) - 객체는 모든 인스턴스를 대표하는 포괄적 의미를 가짐. 인스턴스 설계도를 바탕으로 소프트웨어에 구현된 구체적인 실체. 즉, 객체(object)를 소프트웨어에 실체화한 것. - 실체화된 인스턴스는 메모리에 저장. 객체 vs 인스턴스 - 클래스(Class)의 타입으로 선언되었을 때 = 객체 ( 현실세계. '실체'에 초점 ) - 그 객체가 메모리에 할당되어 실제 사용될 때 = 인스턴스 ( S/W세계. '관계'에 초점 ) 설계도 = 클래스 제품 = 인스턴스 REFE..
- ES2015 이후 추가된 기능으로, 쉽게 말해서 백틱(`) 기능이라고 생각하면 된다. __ 📙 템플릿(Template) 이란? - 서식 or 견본. - 미리 준비되어 있는 틀. __ - 복잡한 문자열(String)을 만들 때 띄어쓰기나 따옴표 등의 오타가 자주 발생함. - 따라서, 백틱(`) 기호를 사용하여 +와 따옴표를 쓰지 않도록 함. const name = 'yjin'; const obj1 = { age: 23 }; const string = `I am ${name}, ${obj1.age} years old.`; - 따옴표 대신 백틱 사용 - 변수들은 ${ } 로 감싸줌 >> 틀을 만들어놓고, 데이터가 들어갈 공간 ${ } 를 줌. - 데이터가 알아서 그 틀에 맞게 들어가 문자열이 완성됨. - ..
ES6(2015) - 함수(Function) - 화살표 함수(Arrow Function) 추가됨. - 기존 ES5 코드 var object = { name: 'Zero', friends: ['One', 'Two', 'Three'], alertFriends: function() { var self = this; // 객체의 this를 변수로 저장해둠. 왜? 🔻 this.friends.forEach(function(friend) { // forEach 안에선 this가 바뀌므로. alert(self.name + ' and ' + friend); }); } }; object.alertFriends(); // 세 번 알림 - this.friends는 해당 객체 내의 friends 변수(=배열)이다. - 즉, A..
객체의 Method를 콜백(Callback 함수)으로 전달할 때 ’this 정보가 사라지는’ 문제가 발생한다. 이 문제는 어떻게 해결해야 할까? let Obj = { class = 3; names = ['lee', 'kim', 'park', 'choi'], this.names.forEach( function(name) { alert('class' + this.class + name); // this 정보가 사라짐 }; 📌 this가 사라지는 경우 - 객체 메서드가 객체 내부가 아닌 다른곳에 전달되어 호출될 때 - 객체의 Method를 콜백(Callback 함수)으로 전달할 때 - 그 외 ) setTimeout(function, 1000) 등의 경우 - this에 window를 할당함. 📌📌 bind() ..