power-girl0-0

해당 블로그를 참고하여 작성하였으며, 공부하고 정리하기 위해 작성한 글입니다. 객체 비구조화 할당 위 소스코드는 이전 글에서 했던 예제와 같은 것으로, 해당 코드를 바탕으로 진행해보자. ( 객체 : 2021/02/15 - [언어/Javascript] - ES6 : 객체 ) const Man = { name: '남도산', actor: '남주혁', job: 'CTO' }; const Girl = { name: '서달미', actor: '배수지', job: 'CEO' }; function print(person) { const text = `${person.job} ${person.name} 역할을 맡은 배우는 ${person.actor} 입니다.`; console.log(text); } print(Man);..

해당 블로그를 참고하여 작성하였으며, 공부하고 정리하기 위해 작성한 글입니다. 객체 객체를 선언할 때는 { } 대괄호 안에 원하는 값들을 넣어주면 된다. 값을 넣을 때는 key:value 형식으로 넣어야한다. 이에 대한 예제는 아래와 같다. const person = { name : '김도현', age : 22 }; console.log(person.name); console.log(person.age); 또 다른 예제로, 드라마 스타트업의 주인공인 서달미와 남도산 정보를 객체 안에 집어 넣어보았다. const Man = { name: '남도산', actor: '남주혁', job: 'CTO' }; const Girl = { name: '서달미', actor: '배수지', job: 'CEO' }; cons..

이전 방식에서 문자열은 ' ' (싱글 쿼테이션), " " (더블 쿼테이션)을 사용하고, 다음줄로 넘어가려면 개행문자(\n)를 사용해야 했다. 이를 해결하기 위해, ES6에서는 ` ` 내에서, multi-line string을 입력할 수 있으며, ${ }를 통해 문자열에 외부 변수를 입력할 수 있다. 예제는 아래와 같다. let name = "김도현"; let age = 22; console.log(` 저의 이름은 ${name}이고, 나이는 ${age}입니다. 만나서 반가워요. `); ${ } 표현식에서, 계산식도 사용이 가능하다. 아래는 위 소스코드에 포함된 내용으로, 계산식을 사용한 예제이다. consoel.log(` 우리 언니는 나보다 3살 많은 ${age + 3}살입니다. `); 또한, ${ } 표..

생활코딩 웹브라우저 javascript를 참고하여 공부하였습니다. 스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다. ( 출처 : https://opentutorials.org/course/743inf.run/pBzy ) 유튜브로 여러 강의를 볼 때를 가정해보자. 여러 강의의 총 시간이 얼마인지 계산해보고 싶을 때가 있기 마련이다. 그 때, 아래와 같은 코드를 사용하면 된다!!^_^ 실습한 유튜브 사이트는 아래와 같다. https://www.youtube.com/playlist?list=PLuHgQVnccGMA0lO0qip6Phh6UL73TS0es 실습 연습을 하고 싶다면, 아래 주소를 사용하면 된다. https://jsbin.com/menuziqute/1/edit?html,output ..

생활코딩 웹브라우저 javascript를 참고하여 공부하였습니다.스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다.( 출처 : https://opentutorials.org/course/743inf.run/pBzy )jQuery이용해서 Ajax를 사용하게 되면 많은 이점이 있는데 그 중의 하나가 크로스브라우징의 문제를 jQuery가 알아서 해결해준다는 것이다. jQuery는 Ajax와 관련해서 많은 API를 제공한다. http://api.jquery.com/category/ajax/ $.ajax http://api.jquery.com/jQuery.ajax/ $.ajax의 문법 jQuery.ajax( [settings ] )setting는 Ajax 통신을 위한 옵션을 담고 있는 객체가 들어..

생활코딩 웹브라우저 javascript를 참고하여 공부하였습니다. 스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다. ( 출처 : https://opentutorials.org/course/743inf.run/pBzy ) JSON이란? JSON(JavaScript Object Notation)의 약자로 JavaScript에서 객체를 만들 때 사용하는 표현식을 의미한다. 이 표현식은 사람도 이해하기 쉽고 기계도 이해하기 쉬우면서 데이터의 용량이 작다. 객체를 만들 때는 { }안에다가 값을 넣어야 되며, 하나씩 구분하는 것은 , 로 한다. 또한, 하나의 객체는 키: 값 형식으로 작성한다. 이런 이유로 최근에는 JSON이 XML을 대체해서 설정의 저장이나 데이터를 전송등에 많이 사용된다. JS..

생활코딩 웹브라우저 javascript를 참고하여 공부하였습니다. 스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다. ( 출처 : https://opentutorials.org/course/743inf.run/pBzy) 예전 웹브라우저는 정적인 시스템이라서, 내용이 바뀌면 페이지 새로고침을 해서 내용을 새롭게 변경해야 했다. 웹이 전자 문서를 염두해두고 고안된 시스템이기 때문이다. Ajax 개념이 도입되면서 모든 것이 바뀌었다. Ajax는 웹브라우저와 웹서버가 내부적으로 데이터 통신을 하게 된다. 그리고 변경된 결과를 웹페이지에 프로그래밍적으로 반영하여, 웹페이지에서 로딩 없이 서비스를 사용할 수 있게 한다. Ajax Ajax는 Asynchronous JavaScript and XML의 ..

생활코딩 웹브라우저 javascript를 참고하여 공부하였습니다. 스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다. ( 출처 : https://opentutorials.org/course/743inf.run/pBzy) 기본 사용법 on은 jQuery에서 가장 중요한 이벤트 API이다. on API를 통해서 jQuery에서 이벤트를 다루는 방법을 알아보자. on의 기본적인 문법은 아래와 같다. .on( events [, selector ] [, data ], handler(eventObject) ) [ ] 대괄호 있는 부분은 생략이 가능하나, 어떤 것을 생략하느냐에 따라 기능이 달라진다. event : 등록하고자 하는 이벤트 타입을 지정한다. (예: "click") selector : 이..