본문 바로가기

WEB

(47)
[JS] 자바스크립트의 객체 객체 객체란, 현실의 사물을 프로그래밍에 반영한 것이다. var name = { firstName = "gang", lastName = "hodong" }; name이라는 변수에 { }로 감싼 덩어리를 넣었다. 바로 이 덩어리가 객체이다. 여기서 fistName과 lastName은 Key가 되고 각각 gang과 hodong은 Value가 된다. 함수를 클래스처럼 사용하게 해주는 키워드 new 자바스크립트에서는 class가 없다. 하지만 그렇다고 하지만 그 기능을 대신하는 함수가 있다. new 라는 생성자 함수를 사용한다면 함수를 클래스처럼 인스턴스를 생성할 수 있다. 사용 예시 function Person(name, gender) { this.name = name; this.gender = gender;..
[JS] 자바스크립트 함수란 ? 함수(function)란? 함수(function)란 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록을 의미한다. 이러한 함수는 필요할 때마다 호출하여 해당 작업을 반복해서 수행할 수 있다. 자바스크립트에서는 함수도 하나의 타입(datatype)입니다. 따라서 함수를 변수에 대입하거나, 함수에 프로퍼티를 지정하는 것도 가능하다. 또한, 자바스크립트 함수는 다른 함수 내에 중첩되어 정의될 수도 있다. 문법 및 형태 function 함수이름(매개변수1, 매개변수2,...) { 실행문; } 자바스크립트에서 함수는 문법적 구문일뿐만 아니라 값(value)이기도 하다. 따라서 함수가 변수에 대입될 수도 있으며, 다른 함수의 인수로 전달될 수도 있다. 다음 예제는 함수를 변수에 저장하여 사용하는 예제이다..
[JS] for in, for of 문? for in 문 for in문은 for문가 다르게 동작하는 반복문이다. C#의 foreach와 같은 기능을 하는 구문인 것 같다. var arr = [1, 2, 3]; for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함. document.write(i + " "); } var arr = [1, 2, 3]; for (var i in arr) { // 위와 같은 동작을 하는 for / in 문 document.write(i + " "); } for에 들어가는 인자 형태가 서로 다르다. for / in 문은 해당 객체의 모든 열거할 수 있는 프로퍼티(property)를 순회할 수 있도록 해준다. for of 문 for / of 문은..
[JS] 식별자가 뭐지? 식별자(identifier) 식별자는 변수나 함수의 이름을 작성할 때 사용하는 이름을 의미한다. 자바스크립트에서 식별자는 영문자(대소문자), 숫자, 언더스코어(_) 또는 달러($)만을 사용할 수 있다. 자바스크립트에서 식별자는 숫자와 식별자의 구별을 빠르게 할 수 있도록 숫자로는 시작할 수 없다. 자바스크립트는 유니코드(unicode) 문자셋을 사용한다. 식별자 작성 방식 자바스크립트에서는 식별자를 작성할 때 다음과 같은 작성 방식을 사용할 수 있습니다. 1. Camel Case 방식 2. Underscore Case 방식 Camel Case 방식이란 식별자가 여러 단어로 이루어질 경우에 첫 번째 단어는 모두 소문자로 작성하고, 그다음 단어부터는 첫 문자만 대문자로 작성하는 방식입니다. Underscor..
[CSS] Box model - inline과 Block의 차이점 display: inline ? 대표적인 태그로는 span을 예로 들 수 있는데, Text 크기만큼만 공간을 점유하고 줄바꿈을 하지 않는다. Block 요소는 포함할 수 없다. 너비(width) / 높이(height) 설정이 가능하지 않고 내부에 포함한 콘텐츠 만큼 높이와 너비를 가지게 된다. display: block ? 대표적인 태그로는 div를 예로 들 수 있는데, 해당 줄의 모든 공간을 점유하고. 다음태그는 무조건 줄바꿈을 한다. BOX 이다! BOX ?! 박스는 다른 박스에 포함되거나, 포함할 수 있고, 너비(width) / 높이(height) 설정이 가능하다. BOX의 특징 3가지 : padding, border, margin 1. 패딩(padding) : 콘텐트과 테두리(border) 사이의..
[HTML]Semantic HTML가 뭐길래 중요한데? Semantic HTML ? 시맨틱(Semantic) HTML을 직역하면 의미론적 HTML이 된다. 사실 무슨 말인지 잘 모르겠지만 의미론적이란 언어에서 단어와 구절의 의미를 아는 것을 뜻한다. HTML에서 semantic element는 해당 element의 의미를 브라우저와 개발자 모두에게 알려줄 수 있다. Semantic elements ? 예를 들어, 태그는 non-semantic 태그라고 할 수 있고, , 등의 태그는 semantic 태그라고 볼 수 있다. 일반적으로 태그만 보고는 이 태그 안에 들어간 내용의 의미를 알 수가 없다. 반면, , 등의 태그는 대략이라도 태그 안에 들어갈 내용의 의미를 유추할 수 있다. 태그 안에는 표가 들어갈 것이고, 태그 안에는 어떤 형태의 글이든 글이 들어갈 것..
[HTML] HTML 개념 정의 및 문법 정리 1. HTML 개념 및 정의 HTML(Hyper Text Markup Language)이란 웹사이트를 만드는 가장 기초가 되는 마크업 언어이며 웹페이지의 내용과 구조를 담당하는 언어로써 브라우저에게 정보를 어떤 형식으로 보여주어야 하는지를 전달해주는 역할을 한다. 마크업 언어(Markup Language)는 문서가 화면에 표시되는 형식을 나타내거나 데이터의 논리적인 구조를 명시하기 위한 규칙들을 정의한 언어의 일종이다. 데이터를 기술한 언어라는 점에서 프로그래밍 언어와는 차이가 있다. 2. HTML의 요소 여는 태그(Opening tag): 이것은 요소의 이름과(이 경우 p), 열고 닫는 꺽쇠 괄호로 구성됩니다. 요소가 시작(이 경우 단락의 시작 부분)부터 효과가 적용되기 시작합니다. 닫는 태그(Clos..