ijooha 님의 블로그

요소와 types 알아보기 요소 보러가기" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input" target="_blank" rel="noopener"> 요소 자세히 보러가기         Form 요소 구글폼, 할 때 그 폼이다.input 태그와 함께 쓰이며, 입력된 데이터를 묶어 action이라는 속성으로 데이터를 어디로 보낼지 입력하여 사용오늘 정리할 거 한줄요약👇👇👇  에 적히는 텍스트와 을 연결해서 사용한다.아래 예시의 경우 'click here'가 라벨, 입력칸이 인풋이다.click here  인풋의 id 속성과 연결해주거나 안에 을 넣어 사용하기도 한다.cheese 이렇게 라벨과 묶어 사용할 수..

문자형(String) 알아보기문자형이 뭔지 모르는 사람 클릭🙋         Index 문자형에 들어가는 모든 character에는  순서가 있다. 그걸 인덱스(index)라고 한다.순서는 0부터 시작한다."hello"라는 string(문자형)이 있다고 했을 때, 파란 숫자가 순서다.불러오는 방법은 > 변수이름[불러오고싶은 순서]"hello"[0] //"h"         속성(Property) .length;example.lengthString(문자형)의 길이를 알려준다.** 인덱스는 0부터 시작하기 때문에, 마지막 글자는 항상 .length -1 이다.example.length //5이 경우 마지막 글자인 'o'의 인덱스는 '4'이지만 string의 길이는 '5'임         규칙(Methods..

내장 객체(Math.methods) 알아보기         종류 Math.PI파이값 반환 Math.ceil(n)올림Math.ceil(3.000001) //4Math.floor내림Math.floor(3.999) //3Math.random()0 아래로 랜덤👇👇아래 추가설명 참고Math.abs(n)정수로 반환 Math.pow(i,n)i의 n승Math.pow(2,5) //32 Math.random()0 아래로 랜덤 숫자 반환Math.floor() 사용하여 활용Math.floor(Math.random() * 5)Math.random() * 랜덤 돌리고싶은 수 + 시작하는 수Math.floor(Math.random() * 5 + 1);//1-5사이의 랜덤 수  이 외에도 정말 많은 Math 메소드들이 있는 것 ..

용어 정리 피연산자(operand)연산을 수행하는 대상, 인수(argument)라고 불리기도 한다.5*2라는 식이 있을 때 5와 2단항(unary), 이항(binary)피연산자의 개수에 따라, 한개면 단항 두개는 이항이라고 부른다.         기본 연산자 기본적인 덧셈, 뺄셈, 곱셈, 나눗셈이 있고% 나머지 연산자** 거듭제곱 연산자가 있다. 덧셈 연산자(+)로 숫자 뿐 아니라 문자열을 병합할 수도 있다."hello" + "world" //"helloworld" 이때 문자형인 경우 숫자여도 문자형으로 병합이 된다. 👇👇👇"2" + 2 //22"hello" + 2 + 2 //"hello4" 덧셈 연산자(+)는 Number()와 동일한 일도 할 수 있다.Number() 대신 앞에 +를 붙여주면 숫자..

콘솔(console) 알아보기         콘솔(console)이란? 크롬에서 마우스 오른쪽 클릭 > 검사 > 상단 메뉴 중 'console' 클릭원하는 값이나 메시지를 입력하면 바로 결과가 나옴따라서 내가 작성한 코드의 흐름을 이해하거나 디버깅할 수 있다.         사용법 \n줄바꿈할 때 사용console.log('Hello\nWorld');//Hello//World console.()console.log()일반 로그 메시지 출력console.warn()경고 메시지 출력console.error()오류 메시지 출력console.table()객체를 표 형식으로 출력

프론트엔드의 기본 구성 알아보기         HTML HyperText Markup LanguageHTML은 웹 페이지의 구조와 내용을 정의하는 데 사용된다.웹 페이지의 텍스트, 링크, 이미지 및 기타 요소들을 마크업하여 사용자에게 정보를 전달한다.보통 뼈대로 비유한다. 기본 구성 요소태그(tag)는 태그는 요소의 종류속성(attribute)은 요소의 특성         CSS Cascading Style SheetsCSS는 웹 페이지의 스타일을 지정하는 데 사용된다.색상, 폰트, 레이아웃 등의 시각적 요소를 조정하여 웹 페이지의 외관을 디자인한다.보통 피부 등 외관으로 비유한다. 작동 방식선택자(selector)를 사용하여 HTML 요소를 지정하고, 해당 요소에 적용할 스타일 규칙을 정의한다.    ..

HTML 기본 용어와 구조 알아보기         기본 용어 요소(element)페이지를 구성하는 부품 태그(tag)요소를 만들 때 사용하는 기호, 안에 들어간다.contents여기서 이 전체가 하나의 요소, 빨간 부분이 태그이다. 속성(attribute)태그에 대한 추가적인 정보 제공이름 = "값" 형태로 기술hi여기서 갈색 부분 href가 속성이다. 주석(comment)코드 설명을 위한 목적으로 사용         기본구조  문서의 최상위 요소로, root요소라고도 한다.다른 메타관련 요소로 나타낼 수 없는 메타 데이터를 나타낸다.페이지 탭에 표시되는 문서의 제목을 정의한다.현재 문서와 외부 리소스 간의 관계를 지정한다. 사이트 아이콘을 설정하는 데에도 사용된다.문서 또는 문서의 일부에 대한 ..

웹에 대해 알아보기         Web이란? 연결된 여러 웹사이트를 통해 정보를 찾고, 읽고, 보고, 공유할 수 있게 해주는 도구웹은 우리가 흔히 아는 블로깅, 구글링 등을 연결해주는 거대한 네트워크이다. 인터넷이 이 네트워크의 도로라면,웹은 그 위를 달리는 자동차다. 우리가 필요한 정보를 인터넷을 통해 실어 나르는 역할. 서버는 식당 주방이다. 음식을 위한 재료가 있고, 주문이 들어오면 음식을 만들어 전달한다.클라이언트는 식당의 손님이다. 원하는 음식을 주문한다.         웹사이트와 웹페이지의 차이점 웹 페이지는 사이트의 전체 구조에 독특하게 기여하여 사용자가 흥미로운 여러 영역 간에 원활하게 탐색할 수 있도록 한다. 예를 들어, 홈 페이지는 일반적인 개요를 제공할 수 있는 반면, 개별 페이지는..

문자형으로 변환 String(value)alert는 매개변수로 문자형을 받기 때문에 자동으로 문자형으로 변환된다.let i = 1;String(i); //'1'         숫자형으로 변환 Number(value)Number(undefined) //NaNNumber("abc123") //NaNNumber("123") //123Number(null) //0Number(true) //1, false > 0         불린형으로 변환 Boolean(value)'무'의 상태면 모두 거짓Boolean(0) //falseBoolean("") //flase   더보기너무 헷갈린다.. 상황에 따라 값이 다 달라서...그래도 블로그에 정리하면서 머리로도 아주 조금 정리가 된 것 같다.헷갈릴때 이 글을 참고해야겠다그..

숫자형(Number) 1234567890NaN일반적인 숫자 (123..)가 있고,아래와 같은 특수 숫자 값(special numeric value)가 있다.infinity무한대 (0으로 나누거나, 직접 참조)NaN숫자가 아님(Not a Number)         문자형(String) "hello"'hello'`hello`역따옴표로 변수나 표현식을 감싼 후 ${}를 넣어주면, 원하는 데이터를 넣을 수 있다.let name = "Amy";alert(`hello, ${name}`);//hello, Amyalert (`the result is ${1+2}`);//the result is 3         불린형(Boolean) true 참false 거짓         Null & Undefined Null존재..