본문 바로가기

Frontend

(38)
[JavaScript] GET, POST, 시맨틱 태그 GET 방식 - type이 text일 때 값 입력하면 주소창 바뀜 - 메소드 미 작성시 기본적으로 GET POST 방식 - 주소창 변화 없음 시맨틱 태그: 크롤러 사용을 위한 것
[인프런] 자바스크립트+jQuery 기초부터 실무까지 : 기초 Part.2 이론 [사용 방법에 따른 함수 종류] 1. 일반 함수 가장 일반적으로 사용한 삼수를 지칭한다. 2. 중첩 함수 함수 안에 함수가 있는 경우 중첩되었다라고 하며 이 때, 함수안에 있는 함수를 중첩함수라고 한다. 내부 전용 함수로 함수 내부의 지역변수처럼 함수 내부에서만 사용할 수 있다. 일반적으로 중첩함수는 이름이 없는 이벤트 리스너로 많이 활용된다. 중복 코드 또는 그룹화가 가능하여 함수 내부의 커다란 기능이나 중복 코드를 내부 함수로 만들어 재사용할 때도 중첩 함수를 사용한다. 아울러 중첩함수는 외부 함수와 내부 함수의 아주 밀접한 관계일 때 사용하는 것이 좋다. 3. 롤백 함수 함수 실행결과 값을 리턴이 아닌 매개변수로 넘어온 함수를 호출해서 넘겨주는 방식을 콜백이라 하며 이때 매개변수로 넘어온 함수를 콜..
[JavaScript] 함수와 이벤트 [함수] 스코프 - 변수를 선언하고 사용할 때 변수가 적용되는 범위 지역 변수 - 변수를 선언한 함수에서만 사용할 수 있는 변수 - 함수 안에서 변수를 선언할 때 var 예약어 사용 전역 변수 - 스크립트 소스 전체에서 사용할 수 있는 변수 - 함수 밖이라면 var 예약어를 사용해서 변수 선언 - 함수 내에서 전역 변수를 선언하려면 var 예약어 없이 선언 [이벤트] 이벤트란 웹 브라우저나 사용자가 행하는 동작을 의미(웹 요소 클릭, 마우스 이동) ex. 마우스 이벤트, 키보드 이벤트, 폼 이벤트, 문서 로딩 이벤트
[Rising Camp] Frontend, React, API 1. DOM이란? DOM(Document Object Model)이란 HTML, XML 문서에 접근하기 위한 프로그래밍 인터페이스로 문서 객체 모델이라고 부른다. 구조화된 문서를 표현하며 자바스크립트와 같은 프로그래밍 언어를 통해 웹 문서에 접근 및 제어할 수 있는 방법을 제공하여 웹 문서를 관리하는 역할을 한다. W3C의 표준 객체 모델이며 계층 구조로 표현된다. nodes와 object로 문서를 표현한다. DOM이란 브라우저에서 다룰 HTML 문서를 객체로 구조화하여 나타낸 문서 객체 모델을 의미한다. DOM은 HTML Elements, Attributes, CSS styles, Events, Methods 등을 제어할 수 있는 표준 인터페이스를 제공한다. 즉, HTML 파일 내용을 토대로 만들어지며..
[JavaScript] argument 객체 자바스크립트 함수는 매개변수를 가진다.여기서 매개변수와 같이 사용되는 용어가 있는데 바로 전달 인자이다. 매개변수가 함수 선언 시 작성되는 변수라면, 전달 인자는 함수가 호출될 때 전달되는 값이다. 자바스크립트는 전달인자의 개수와 매개변수의 개수가 달라도 에러를 발생하지 않는다. 그래서 매개변수와 무관하게 함수 호출 시 더 많은 인자를 전달할 수 있다. 매개변수 외에 함수에서만 사용 가능한 특별한 객체를 제공하는데 arguments 객체이다.
[jQuery] 이론 jQuery 클라이언트 측 페이지 제작을 손쉽게 만들어주는 자바스크립트 라이브러리. jQuery 기능이 있는 라이브러리 파일을 연결해야 함. jQuery를 이용한 노드(웹 요소)찾기 var $변수 이름=$("CSS 선택자") 가장 기초적인 노드 찾는 방법 [$()] - 함수 이름이 $()인 함수를 호출하는 것 - 선택자에 해당하는 노드를 찾아주는 역할을 함 - $() 함수에서 리턴해주는 값을 저장하기 위해서 만든 변수로 앞에 $를 붙이는 이유는 jQuery 기능이 들어있는 변수를 표현하기 위함 [선택자] - css의 선택자를 의미 - 찾고 싶은 선택자를 만들어 $()함수에 매개변수 값으로 넣어주면 됨 [이벤트 등록] $대상.on("이벤트 이름", "이벤트 리스너"); $대상.단축 이벤트 함수(이벤트 리스..
[JavaScript] 예외 처리하기 자바스크립트에서 사용할 수 있는 예외 처리 방법에는 throw문과 try-catch-finally문이 있다. 예외 처리 시 에러 종류는 크게 두 가지로 나뉜다. 하나는 예상치 못한 에러, 다른 하나는 개발자가 의도한 에러이다. 개발자가 의도한 에러는 코드에서 잘못될 가능성을 예상하고 발생시키는 에러로 throw문을 사용한다. 이는 고의로 에러를 발생시켜 예외 상황을 알리는 역할을 한다. 그리고 throw문이 실행되면 실행되고 있던 블록을 빠져나간다.
[CSS] Flex, FlexBox FlexBox FlexBox를 사용하면 box의 크기에 관계없이 일정한 사이즈별로 배치 가능 1. container container 속에 item이 있다. container에 지정할 수 있는 속성에는 display, flex-direction, flex-wrap, flex-flow, jstify-content, align-items, align-content가 있다. item에 지정할 수 있는 속성에는 order, flex-grow, flex-shrink, flex, align-self가 있다. 2. main axis, cross axis float은 이미지와 텍스트를 어떻게 배치하는지 정하는 것 float: left, float: center, float: right