프론트엔드 개발자가 될거야.
-
[TIL] Today I Learned : 배열의 반복문 - .forEach() / .map() 차이프론트엔드 개발자가 될거야./js 2022. 6. 24. 21:46
for문처럼 array의 반복문으로 사용되는 map, forEach 메서드를 공부해보았다. 둘 다 정말 많이 쓰이는 메서드라는데... 무슨 차이가 있을까?? 일단 공통점은 두 메서드 모두 원본 배열을 건들지 않는 것이다. 원본 배열을 가지고 어떤 짓을 해도 원본 배열은 원래의 값을 그대로 가지고 있다. ✍🏻✍🏻✍🏻 그리고 arrow function은 map메서드와 forEach메서드와 같이 자주 쓰이니 arrow function에 대한 이해를 확실히 해야한다. * 참고 arrow function을 가장 많이 사용할 때는 callback 함수로 사용할 때이다. callback 함수란, 인자로 전달되는 함수라고 생각하면 된다. Array.map() 아래는 map 메서드에 대한 설명이다. https://www..
-
[TIL] Today I Learned : 개념공부 - string <-> number 변환 / 날짜 객체프론트엔드 개발자가 될거야./js 2022. 6. 23. 18:02
String Number 변환 자바스크립트는 데이터 타입을 신경쓰지 않는다. 이것은 편할 수는 있지만 자칫하면 오류가 날 수 있다. 주의! +는 둘 중 하나가 문자면 둘 다 문자! -의 경우, 오로지 숫자에만 사용 되는 연산 console.log('200'+'10'); //20010 console.log('200'-'10'); //190 console.log(200+'11'); //20011 console.log('200'+11); //20011 console.log('200'-'안녕'); //NaN 날짜 객체 var rightNow = new Date(); console.log(rightNow); // 2022-06-23T00:45:06.562Z 2022-06-23T00:45:06.562Z 이것은 사람..
-
[TIL] Today I Learned : Srting - sliceCityFromAddress함수프론트엔드 개발자가 될거야./js 2022. 6. 23. 17:37
String 함수 알아보기 알아서 대소문자를 바꿔주는 함수 String.toUpperCase(); 이름에서 보면 알 수 있듯이 대문자로 바꿔준다. String.toLowerCase(); 또한 이름에서 보몀 알 수 있듯이 소문자로 바꿔준다. let lastName = 'Yeri Kim'; let upperLastName = lastName.toUpperCase(); let lowerLastName = lastName.toLowerCase(); console.log(lastName); // Yeri Kim console.log(upperLastName); // YERI KIM console.log(lowerLastName); // yeri kim 문자 길이 배열의 길이는 length 라는 속성으로 알 수 있..
-
[TIL] Today I Learned : 배열 요소 추가, 제거 - divideArrayInHalf 함수프론트엔드 개발자가 될거야./js 2022. 6. 23. 16:02
배열 요소 추가하기 - index로 접근,push(), unshift() 1. index로 접근 let cities = [ ]; 일 때 cities[0] = "서울"; // ["서울"] cities[1] = "대전"; // ["서울", "대전"] cities[2] = "대구"; // ["서울", "대전", "대구"] 이렇게 요소를 추가해 줄 수 있다. 2. 메서드로 접근 push는 배열의 마지막 부분, 즉 꼬리에 요소들을 추가하고, unshift는 배열의 맨 앞부분, 즉 머리 부분에 요소를 추가한다. let cities = [ ]; 일 때 cities.push("경주", "전주"); // ["경주", "전주"] cities.unshift("인천"); // [ "인천", "경주", "전주"] 배열 요소 제..
-
[TIL] Today I Learned : 수학표현식, 논리연산자, 가위 바위 보 게임 함수 만들기(rockPaperScissors 함수)프론트엔드 개발자가 될거야./js 2022. 6. 23. 15:25
공부하다가 헷갈리는 개념들이 있어서 정리해보려고 한다. 간단하지만 헷갈리는...... 컴퓨터 언어에서 사용되는 수학 표현식 let num = 1; num++; console.log(num); // 2 num++는 풀어서 쓰면 num = num + 1; 이다. let num = 1; let newNum = num++; console.log(num); // 2 console.log(newNum); // 1 잠시 여기서 의문! num도 2고 newNum도 2 일 줄 알았는데..... 왜 저런 답이 나왔을까? let newNum = num++;을 풀어서 써보면 let newNum = num = num + 1 이다. newNum = num ---> newNum = 1 이고 그 다음에 num + 1 을 해주어서 n..
-
[TIL] Today I Learned : for문 - findSmallestElement 함수프론트엔드 개발자가 될거야./js 2022. 6. 22. 20:38
많이 공부했다고 생각했는데... 문제 푸는데 많이 막혔다! 먼저, for문에 대해 알아보자. for문 for 문을 사용하면 코드를 원하는 만큼 반복시킬 수 있다. 실행 조건에 따라 언제부터 언제까지 반복하게 될 것이라고 알려주면 된다. 반복문 내의 조건문 반복문과 조건문은 함께 많이 쓰인다. 잘 이해해두어야 한다! 예시를 함께 보자. const home = "대전"; let cities = ["서울", "대전", "대구", "대전", "광주", "대전"]; for (let i = 0; i < cities.length; i++) { if (cities[i] === home) { console.log("아, "+ cities[i] +" 사시는군요"); } } for (var i = 0; i*
-
레이아웃의 모든 것프론트엔드 개발자가 될거야./htmlcss 2022. 6. 21. 16:16
1. position 속성 - relative, absolute, fixed 2. inline, inline-block, block 1. position 속성 - relative, absolute, fixed position 에서 사용하는 값은 4개가 있는데 static 은 거의 사용하지 않아서 relative, absolute, fixed를 정리해보았다. relative relative는 position: relative; 자체로는 특별한 의미가 없다. top, right, bottom, left 프로퍼티가 있어야 힘을 발휘한다. 위치를 이동시켜주는 top, right, bottom, left 프로퍼티가 있어야 원래의 위치에서 이동할 수 있는 것이다. top, right, bottom, left 는 p..
-
Semantic Web과 Semantic Tag프론트엔드 개발자가 될거야./htmlcss 2022. 6. 20. 22:18
Semantic Web이란? : 의미를 가지는 웹 일반 웹은 컴퓨터가 정보를 알지 못하지만 semantic web은 컴퓨터가 정보를 알 수 있다. 웹에 존재하는 수많은 웹페이지들의 잡다한 데이터 집합에 의미와 관련성을 지니는 메타데이터를 부여하여 거대한 데이터베이스를 구축한 것이다. 메타데이터 : 다른 데이터를 기술하기위해 사용되는 언어 : 특정 데이터를 검색엔진으로 쉽게 찾아낼 수 있으며 데이터를 사용하는 사람의 눈에 보이지 않고, 컴퓨터가 이용함 왜 생겨났을까? 인터넷이 활성화되면서 웹의 사용이 폭발적으로 늘어났다. 이토록 복잡하고 고도의 동적인 웹 공간에서 지식을 믿을 만하게 검색, 관리하고 웹 장치들과 인간이 교류하기 위해서는 정보의 의미 처리가 필수적이게 되었다. 따라서 의미 정보를 자동적으로 ..