일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- 멋쟁이사자처럼
- ubuntu
- display
- 변수
- false
- 조건문
- boolean
- Inline
- block
- HTML
- function
- LIKELION
- 프론트엔드스쿨
- object
- position
- CSS
- 선언
- http
- STYLE
- True
- array
- Project
- terminal
- react
- js
- Absolute
- 선택자
- 리액트
- javascript
- API
- Today
- Total
목록javascript (10)
Jeden Tag, aufrichtig und lustig.
이전에 리액트를 사용하면서 npm을 사용한 경험이 있다. 이로 인해 npm은 리액트를 사용 할 때만 활용한다고 생각했었는데, JavaScript를 공부하는 와중에 npm을 사용하게 됐다. 이런 경험을 통해 평소 모호하게만 알고 있던 npm에 대해 공부하고 싶어 아래에 정리하게 되었다. 1. NPM이란? NPM은 Node Package Manager의 준말이며, Node.js 기반 패키지(모듈)들을 모아둔 저장소이자 매니저다. npm을 사용하고 싶다면, node.js가 먼저 설치되어야 하는데 node.js와 npm의 버전을 확인하고 npm을 설치하고 싶다면 터미널에 아래와 같이 입력하면 된다. node -v //node 버전 확인 npm -v //npm 버전 확인 npm init // npm 설치 2. N..
자바스크립트를 활용하면서 수 없이 사용하는 array와 object 유형의 데이터는 이미 자바스크립트에 내장된 new Object(), new Array()라는 생성자함수에 의해 인스턴스로서 생성된다. 객체와 배열을 통해 생성자와 인스턴스를 자주 사용하고 있지만, 그 뜻에 대해서는 모호하게 알고 있었고, 일반함수와 다른 점은 무엇인지 궁금하여서 공부하게 되었다. 1. 개념 생성자 함수? 생성자 함수는 생성자를 만드는 함수를 의미 한다. function MakeSong(genre, singer) { this.genre = genre; this.singer = singer; this.introduce = function () { console.log( "이 노래는 " + this.genre + " 장르이고,..
삼항연산자는 '조건연산자'라고 불리기도 하며, if문과 비슷하다. 삼항연산자의 형식 조건식 ? true일 때 실행되는 표현식 : false일 때 실행되는 표현식 const coffeePrice = 7500; const message = (coffeePrice>4000) ? '안살래요!' : '하나 주세요!'; console.log(message); // 조건식이 true일 경우 message 변수에 true값을 사용하게 된다. 삼항연산자는 조건식의 참,거짓에 따라 코드실행이 된다는점에서 if문과 비슷하지만, if문과의 차이점은 코드 실행 결과값을 변수의 값으로 사용할 수 있다는 것이다. 삼항연산자의 중첩 삼항연산자를 중첩하여 다양한 경우에 따라 코드를 실행할 수 있다. let coffeePrice = 7..
const 상수 변수(constant variable)이며, let과 비슷하게 변수를 선언할 때 사용하는 예약어다. 재선언하거나 재할당 할 수 없으며, 블록레벨의 스코프를 가진다. ->재할당이 없는 변수는 const예약어를 사용하는 것이 좋다.
let ES6이후로 var를 보완한 let과 const예약어가 생겼다. * ES : ECMAScript var의 단점 1. var예약어를 누락하면 의도치 않게 전역 변수가 된다. 2. 코드량이 많아지면 실수로 사용중이던 변수를 재선언하거나 값을 재할당하는 경우가 발생한다. 스코프의 범위 함수 영역(레벨)의 스코프 : var 블록 영역의 스코프 : let / const *( )블록이나 { }블록 안에서만 사용가능한 변수를 '블록변수'라고 한다. 블록영역 스코프 let 예약어로 선언한 변수는 변수를 선언한 블록({ })에서만 유효하다. function iLike(n) { let sum = 0 ; for(let i = 1; i < n ; i++){ sum += i ; } console.log(sum); } 만..
반복문-for 반복문은 동일한 동작을 특정한 조건이 거짓으로 판별될 때까지 반복해서 수행하는 것을 의미한다. 조건 만족여부를 판별하는 counter를 사용하여 동작한다. *counter로 주로 i를 사용한다. for (초기 상태 ; 조건 ; 변화) { 수행할 동작 } for명령어를 사용한다. 소괄호 안에는 1. counter의 초기상태 2. counter가 만족해야하는 조건 3. 조건 충족시 counter의 변화 내용 이 담겨있다. counter의 초기상태 (초기화문) 1.1. 초기화문 작성 시 변수 선언자를 써주어야 한다. 1.2. 변수명은 보통 index를 의미하는 i로 선언한다. 1.3. index가 증가할 경우 숫자는 보통 0부터 시작한다. counter가 만족해야하는 조건 (조건문) 2.1. i..
splice 배열 내의 특정한 요소를 삭제하거나, 다른 요소로 대치하거나 새로운 요소를 추가할 때 사용하는 메소드다. splice(start,delete,item) 필요에 따라 인자를 최소1개만 사용 할 수 있다. 첫번째 인자 : 배열의 index의 시작점 두번째 인자 : 삭제할 요소의 개수 세번째 인자 이후 : 추가하고 싶은 요소 let num = [1,2,4,5,7]; num.splice(2,1,10); console.log(num); // [ 1, 2, 10, 5, 7 ] 댓글 삭제 기능을 구현할 때 splice 메서드를 많이 활용한다.
변수 이름을 정할 때, 아래와 같이 몇 가지 주의할 점이 있다. 1. 대소문자 구분 변수이름, 함수이름, 연산자 모두 대소문자를 구분한다. ex. myCandy과 MyCandy는 다른 변수이다. 2. 첫 번째 문자는 반드시 글자나 밑줄(_), 달러기호($)중 하나. 3. 두 번째 문자부터는 글자, 밑줄, 달러($), 숫자 중에서 자유롭게 사용 가능. 4. 변수이름, 함수이름 등 camelCase(카멜케이스) 방식으로 쓸 것. 5. snake_case 표현법도 있지만 잘 사용하지 않음 (변수이름에 -는 사용할 수 없으므로, _를 사용할 것) 6. 가독성 높은 변수이름으로 설정 1) 다른 개발자, 혹은 먼 훗날의 자기 자신이 이 코드를 쉽게 이해할 수 있도록 2) 커뮤니케이션에 들어갈 리소스를 줄일 수 있어..
function (함수) 함수는 java script를 사용하면서 많이 활용 된다. 함수 동작 3단계 1. Input 받기 2. 기능 수행 3. Output 반환 함수가 동작하기 위해서는 함수가 선언(정의)된 후 실행(호출)이 필요하다. 함수 선언(정의) function sayHello ( ) { console.log(‘Hello! Coder!’) } 함수 이름 : sayHello input : ( ) 함수 기능 : console.log(‘Hello! Coder!’) 함수 실행(호출) sayHello() ->Hello! Coder! *함수 안에서도 변수 선언이 가능하다. ex. function sayHi(){ let friend = "Coder" console.log("Hi! ," + friend) } ..