일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- IOS
- xcode
- 풀스택
- php
- HTML
- iOS 개발자
- front-end
- 애니메이션
- image
- 비전공 개발자
- button
- 비전공자
- jQuery
- Animation
- css3
- CSS
- html5
- ipad
- react
- 자바스크립트
- SWIFT
- 백엔드
- hover
- 프론트엔드
- javascript
- effect
- iPhone
- 개발자
- keyframes
- MAC
- Today
- Total
목록javascript (248)
비전공자 개발일기
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/mRg29/btrfp3iJ5sH/SptaqAKBlvF28zICu1Wvqk/img.jpg)
Desktop Style 3D Page page1 page2 page3 page4 const wrapper = document.querySelector(".wrapper"); const page = document.querySelectorAll(".page"); const indicator = document.getElementById("indicator"); let indicator_li = indicator.querySelectorAll("li"); let yDeg = 0; let indicator_num = 1; let indicator_length = page.length; let w = page[0].offsetWidth; let page_angle = 0; let page_vector = 0;..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cJljoL/btrfs6rvkL5/RHOjybnCOo4KTrAPc0nHb0/img.jpg)
class Codelab extends React.Component { render() { let text = "I'm IRONMAN" let style = { backgroundColor: "aqua" } return( {text} ); } } class App extends React.Component { render() { return( ) } } ReactDOM.render(,document.querySelector("#root")) ------------------------------------------------------------------- class Codelab extends React.Component { render() { return( Hello {this.props.name..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/UAr3j/btrfpsvo6rv/D63UL22iQwKBsKQAxhGTm0/img.jpg)
계산기 caption { font-size: 32px; margin: 20px; } table { width: 320px; text-align: center; margin: 10px auto; } table, th { background: #333; } th { padding-right: 10px; height: 80px; } td { height: 75px; text-align: center; } th > input { width: 100%; border: none; background: #333; color: #fff; text-align: right; font-size: 48px; } td > input[type = "button"] { width: 100%; height: inherit; colo..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bVFQk0/btrfpCEipQA/MVzYoeRsOs5fErYWXfVQpk/img.jpg)
TV Show Search Search const form = document.querySelector("#searchForm") form.addEventListener("submit", async (e) => { e.preventDefault(); const searchTerm = form.elements.query.value; const res = await axios.get(`https://api.tvmaze.com/search/shows?q=${searchTerm}`); // console.log(res.data[0].show.image.medium); makeImages(res.data); form.elements.query.value = ""; }) const makeImages = (show..
map() => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map find() => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find findIndex() => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex filter() => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global..
★ 모든 method는 지정한 배열 내 요소들로 진행 array.map(x => x *2)이면 이때 x는 array[0], array[1].... 이 되는 것! // Array.map(함수) const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]; const doubles = numbers.map(function (num) { return num * 2; }) console.log(doubles) /////////////////////////////////////////////////////////////// // Array.forEach(함수) const numbers = [1, 2, 3, 4, 5, ..
// array.filter(function) let numbers = [1, 2, 3, 4, 5]; let result = numbers.filter(n => n % 2 ===0) console.log(result) // [2, 4] function f1() { return "Hello World!" } function f2(str: string) { return str } // f2(1234) error f2("I'm IRONMAN") document.title = "Typescript Basic" interface Friend { name: string; favoriteColor?: string; } function add(friend: Friend) { let name = friend.name; ..
// 숫자 데이터 형식: number 키워드로 숫자 데이터 지정 후 정수 또는 실수 저장 namespace NumberNote { // [1] 숫자 형식의 변수 선언 및 초기화 let age : number = 21; // 정수 const PI : number = 3.1415922714; // 실수 // [2] 문자열을 다시 대입하려고 하면 에러 발생 // age = 'abc'; // [3] 사용 console.log(`나이 : ${age}`) console.log(`PI : ${PI}`) } // 숫자 구분자 const rich =9_999_999_999_999; console.log(rich) // 9999999999999 // 문자 데이터 형식: string namespace StringKeywor..