FrontEnd
04_JS_클래스
클래스 객체를 만들 수 있는 새로운 방법 클래스를 생성하는 방법은 다음과 같다. class A{ } console.log(new A()); const B = class{}; console.log(new B()); //console.log(new B); 도 가능 //new C(); //class C{}; // 에러(호스팅이 적용되지 않음.) constructor(생성자) C++에서의 생성자 개념과 똑같았다. 객체를 만들때 자동으로 호출되는 함수라고 생각하면 될 꺼 같다. class A{} console.log(new A()); class B{ constructor(){ console.log('constructor'); } } console.log(new B()); class C{ constructor(na..
03_JS_객체
객체 (object) 함수,클래스는 결국 '틀'이라 생각할 수 있고, 직접 사용하려면 객체를 생성해야 한다! function A() {} const a = new A(); console.log(a,typeof a); //객체를 생성함 console.log(A()); //함수를 그냥 실행하고 return을 받아옴 즉, 함수를 객체나 객체의 인자로 자유로이 사용이 가능하다는 것이다. function A() { this.name = 'mingyu'; } const a = new A(); console.log(a); //A {name: 'mingyu'} function B() { this.hello = function () { console.log('hello'); } this.name = 'mingyu' } ..
02_JS_조건,반복,함수
조건문 어느 언어와 똑같이 if 조건식 안이 참인 경우에 실행되는 문법이다. false,0,'',null,undefined,NaN 등이 들어오는 경우 false로 평가되게 된다. 위 값이 아닌경우는 모두 True로 평가되게 된다. >> 빈 배열이나 블록( {} , [] )가 입력되어도 참으로 인식한다! 물론 else와 else if{}도 사용할 수 있다. 표현식 &&를 사용하면 if문처럼 실행시킬 수도 있다. let n = 5; n%5 === 0 && console.log('실행!') ||를 사용하면 오히려 앞표현식이 참이면 뒤표현식을 실행할 필요가 없어서 실행하지 않는다. 즉, 반대로 작동하게 된다. 삼항 연산자 let n = 5; console.log(n%5 === 0 ? '5의배수':'5의배수가 아..
01_JS_변수,상수,자료형
이제 드디어 자바 스크립트에 대해 공부하기 시작했다! 파이썬,c,c++ 등의 언어와 어떻게 다를지 기대가 된다! 자바 스크립트 (Java Script) >>스크립트 언어 >>인터프리터 언어 자바라는 이름이 있긴 하지만 자바와 사실 별 연관은 없다! 당시 인기있던 언어가 자바였어서 그 인기를 타기 위해서 라고 했다 ㅋㅋ 자바스크립트는 웹브라우저만 만드는 역할을 하는것이 아니다. node.js를 이용하여 서버사이트나 데스크탑 애플리케이션을 만들수도 있으며 모바일 애플리케이션도 만들 수 있다. ecma인터네셔널 표준 문법을 정의하는 공식 사이트 chrome과 node.js가 필수이다!! console.log('hello JavaScript') 모든언어의 시작이듯 hello JavaScript를 실행시켜 보겠다..
15_Bootstrap
Bootstrap Bootstrap.css를 불러오고, 해당 파일에 정의된 버튼,레이아웃등을 가져와서 사용하는 것 클래스로 간단하게 불러와서 사용할 수 있다. 트위터에서 개발하였다. 쉽게 생각해서, 만들어져있는 양식들을 가져와서 내가 게시판 등을 만들때 보다 편하게 사용할 수 있는것! 오픈소스들을 가져다 쓰는 개념이라고 보면 되겠다. bootstrap을 사용하기 위해서는 먼저 css에 부트스트랩을 추가하는 부분이 필요하다. 위처럼 링크로 표시해도 되고, 직접css파일을 다운받아서 추가해도 상관없다!! 공부할때 3.4.1버전으로 써봤는데 아직도 3버전기반 으로 작동하는 웹페이지가 많다고 하니 3버전으로 공부하고 4버전적용이 되면 쓰는게 좋은거 같다. 레이아웃 다 더하면 12가 된다는 것이 핵심이다. col..
14_SCSS_함수
함수(Functions) 자신의 함수를 정의하여 사용할 수있다. Mixins과 거의 유사하지만 반환하는 내용이 다르다. mixin은 지정한 스타일을 반환하는 반면, 함수는 연산된 특정 값을 반환하는 개념이다. 즉 보통 언어에서 사용되는 함수의 개념과 같다. 사용 방법은 위와 같으니 간략하게 보고 넘어가보자. 함수 이름 중복 함수는 함수이름을 그대로 사용하기 때문에 SCSS의 내장함수와 이름이 겹치는 경우가 발생할 수 있다. 예를들어 SCSS안에 이미존재하는 red()를 만들었다면 문제가 생길 수 있으며 extract-red()이런식으로 별도의 접두어를 두어서 사용해야 한다. 내장함수를 다 외우는것은 불가능하기에 my_red() 이런식으로 프로젝트마다 정해두는것도 방법이다. if(함수) 조건의 값(bool..