본문 바로가기
728x90
반응형

JavaScript11

[javascript] JSX ? html 태그로 표현되어있는 문법을 createElement 로 변환해준다. const vdom = 헤더 첫번째 두번째 위에 있는 코드가 아래와 같이 변환이 된다. "use strict"; const vdom = /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("h1", null, "\uD5E4\uB354"), /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", { style: "color:red" }, "\uCCAB\uBC88\uC9F8"), /*#__PURE__*/React.createElement("li", { s.. 2023. 1. 13.
[javascript] 배열 연산의 형태 여러가지 배열 연산 형태 함수 형태나 쓰임이 많다보니 코드를 봤을때 대체 무슨 의미인지 파악이 어려워서 공부하다가 형태를 기억하면 좋을것 같아서 남겨놔봤다. type Book = { title: string; copyright?: string; author?: string; }; const books: string[] = [ "헨리 6세", "리처드 3세", "실수 연발", "말괄량이 길들이기", "헨리 8세", ]; // foreach 문 books.forEach((book: string, idx: number, books: string[]) => { console.log(book, idx); }) // map 사용1 const bookObject: Book[] = books.map((book:stri.. 2022. 12. 23.
[Javascript] 함수 형태 매일 봐도 까먹는 자바스크립트 함수형태들... function fn(x){ return x + 100; } const result = fn(10); # 이름없는 함수 const fn2 = function (){ return 100; }; fn2(); # 즉시 실행 함수 (function(){ console.log('test') })(); # Arrow 함수 const fn3 = () => { return 100; } const fn4 = () => 100; # Generator 함수 # 최초 호출하면 함수가 실행되지 않고 실행 준비상태로 만듬. # 그리고 객체를 반환하며 이 객체에는 함수를 실행할 도구가 담겨져 있다. # 도구를 이용해서 함수를 실행하고 멈추고 할수 있음. function* fn5(){ .. 2022. 12. 20.
[나는 리뷰어다] <Vue.js 첫걸음> 으로 Vue.js 의 첫걸음을 시작하자. 요즘 보면 JavaScript 라이브러리와 프레임워크들을 정말 많이 사용하고 있고 그 사용 폭도 점점 넓어지고 있다. 종류도 많지만 각각의 특성도 다양해서 정말 따라가기 힘들다. 워낙 넓다보니 뭐부터 시작해야 할지도 잘 모르겠다. 최근 동기들과 React를 조금씩 공부하고 있는데 React 와 Vue의 차이를 좀 알아볼겸 이번 리뷰 도서로 선택을 했다. 보통 모르는 언어를 처음 접할때에는 가장 중요한게 이론이다. 아무생각없이 Copy&Paste만 해가지고는 처음에는 좀 빠를지 몰라도 나중에는 막히게 된다. 이 책도 읽다보면 빠르게 진도를 나갈수 있는 책은 아니었다. 특히 나같이 Javascript 에 대해서 많은 지식을 가지고 있지 않은 사람들에게는 정말 천천히 끈기를 가지고 읽어야 하는 책이다. 책 내.. 2018. 5. 24.
edX - Introduction to ReactJS Module1 내용정리 edX사이트에서 Introduction to ReactJS 강의를 들으면서 내용을 정리해봤다. What is ReactJS?ReactJS 는 상태에 따라서 View 레이어를 만들어 주는 라이브러리이다.React Compnents는 Virtual DOM 을 생성한다. ReactCompnent의 상태가 변경되면 새로운 Virtual DOM을 생성하고 차이점을 분석한다. 그리고 효과적인 방법으로 HTML DOM 에 반영한다. Rendering Elements- React ElementsReact Elements 는 DOM 노드에 표현되는 Object 이다. JSX를 사용해서 syntax를 작성한다. React Elements와 React Components는 다르다. React Elements를 DOM 에 표.. 2018. 4. 18.
React 에서 props 사용 props 는 컴포넌트에서 사용할 데이터중 변하지 않는 데이터를 다룰때 사용한다. Parent 컴포넌트에서 child 컴포넌트로 데이터를 전달할 때 props를 사용한다. 컴포넌트의 render() 메소드 내부에 {this.props.propsName} 형태로 넣고 컴포넌트에서 사용할 때에는 안에 propsName='value' 형태로 값을 설정 한다. - render() 메소드 내부 12345678910111213class App extends React.Component { render(){ let text = "Hello HI"; return ( ); }}Colored by Color Scriptercs - 컴포넌트 1234ReactDOM.render( , rootElement);cs - Defau.. 2017. 1. 9.
[한빛리더스3기]함수형 자바스크립트 함수형 자바스크립트저자마이클 포거스 지음출판사한빛미디어 | 2014-02-01 출간카테고리컴퓨터/IT책소개이 책은 자바스크립트를 올바로 사용할 수 있는 방법으로 함수형 ... 자바 스크립트를 작성하다보면 빠지지 않는것이 함수이다.그런데 과연 이 함수가 적절히 사용된건지, 아니면 문법에 맞게 작성된것인지 알기 힘들때가 있다.같은 기능인데 다른 선언 방식, 다른 형태의 함수들이 소스상에 존재하게 되면.. 거의 이건 블랙홀이다 싶을 정도이다. 그런 면에서 이책은 보다 이론적으로 지식을 쌓기에 좋을 것 같다는 생각이 든다.아주 기본적인 책 보다는 그보다 한단계 위정도? 기초를 익힌 후에 자신이 그동안 작성한 자바스크립트 소스를 보며 이건 이래서 틀렸구나, 이런 방법보다는 다른 방법이 효율적이구나 라는 생각을 할.. 2014. 3. 22.
[2012.01.18]자바스크립트 마스터하자 JavaScript Cookbook저자셸리 파워즈 지음출판사한빛미디어 | 2011-12-26 출간카테고리컴퓨터/IT책소개전문가의 검증된 코드로 배우는 자바스크립트 문제 해결 노하우어떤...글쓴이 평점 우리가 자주 쓰는 자바스크립트에 대한 문제와 해결책에 관한 내용이 시작 부터 끝까지 가득 담겨있는 책이다. 챕터의 내용도 문자열, 정규표현식, 날짜, 숫자 관련등으로 해서 주제별로 잘 분류해놓은것 같다. 항상 구글링을 해서 어디서 듣보잡 코드를 복사해서 붙였던 것을 이제는 제대로 알고 사용할수 있을 정도의 내공을 실어줄수 있는 책이다. 이 책 전에 Javascrpit+Jquery 입문 책을 봐서인지 몰라도 내용들이 무척 친근하다. 앞의 책이 기초라고 한다면 이책은 약간 상급자 레벨정도. 그렇다고 책이 어렵거.. 2013. 12. 20.
[2012.01.07][한빛리더스3기]Javascript 익히기!! JavaScript jQuery 입문저자윤인성 지음출판사한빛미디어 | 2011-12-14 출간카테고리컴퓨터/IT책소개[출판사서평]1. 이 책이 제시하는 핵심 내용 자바스크립트 기초...글쓴이 평점 많은 프로젝트에서 java, spring, jsp, 등등의 기술을 많이 사용한다. 이런 기술들과 마찬가지로 Javascript 또한 상당히 많이 사용되고 있다. RIA기반 툴들도 사용문법이 Javascript기반으로 되어있고 이래저래 사용빈도가 상당히 높다. 그럼에도 불구하고 보통 Javascript는 따로 공부한다기 보다는 그때그때 인터넷 찾아서 붙여넣기 하는 경우가 대부분이다. 그래서인지 인터넷 상에는 수많은 소스코드가 있고 그중에는 검증되지 않은 코드들도 많이 존재한다. 그리고 어떤 것이 표준에 맞는 내용.. 2013. 12. 20.
JavaScript 객체 변환 toJSON javascript 객체를 JSON 객체로 변환하는 함수.JSON.parse() : JSON 형태 문자열을 자바스크립트 객체로 변환JSON.stringify() : 자바스크립트 객체를 JSON 형슥으로 변환결과값Object {name: "TEST", gender: "Male"} test.html:10{"name":"TEST","gender":"Male"} test.html:11Fri May 10 2013 08:59:51 GMT+0900 (대한민국 표준시) test.html:152013-05-09T23:59:51.036Z test.html:16"2013-05-09T23:59:51.036Z" test.html:17"2013-05-09T23:59:51.036Z" 정말 요즘 javascript, jquery때문.. 2013. 5. 10.
JavaScript var Scope 자바 스크립트를 보다보면 편리하다는 느낌이 들긴 하는데 한편으로는 멘붕이 오기도 한다. -_-;; 정의를 안해도 그냥 가져다 쓰면 되고.. 파라메터리 변수, 함수 등을 맘대로 넘기고.. 참... 편리한건지.. 난장판인건지.... 아래 소스를 보게 되면.. 같은 이름의 변수들이 계속 정의된다. -_-;;; 허용이 되긴 하지만.. 저렇게 사용하지 말아야지.. 라는 생각이 든다. 2013. 3. 15.
728x90
반응형

티스토리툴바