순수함수 : 


1. 들어오는 인자가 같으면 항상 동일한 결과를 리턴하는 함수.

2. 함수가 받은 인자 외에, 다른 어떤 외부의 상태에 영향을 끼치지 않는 함수.

3. 리턴값 외에는 외부와 소통하는것이 없는 함수.



일급함수 : 


1. 함수를 값으로 다룰 수 있는 개념.



'frontend > Java Script' 카테고리의 다른 글

6. 함수형 프로그래밍 - pipe  (0) 2019.03.15
5. 함수형 프로그래밍 - reduce  (0) 2019.03.15
Javascript - 클로져( Closure )  (0) 2019.03.14
4. 함수형 프로그래밍 - each  (0) 2019.03.14
3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14





function reduce( $list, $fn, $memo )
{
let memo = $memo;
each( $list, ( $item ) => memo = $fn( memo, $item ));

return memo;
}

function each( $list, $fn ){
for( let item of $list ){
$fn( item );
}
}

function pipe()
{
let fns = arguments;
return ( arg ) => reduce( fns, ( arg, fn ) => fn( arg ), arg );
}

let f1 = pipe(
( a ) => a + 1,
( a ) => a + 2,
( a ) => a * a
);

console.log( f1( 1 ));
console.log( f1( 2 ));


'frontend > Java Script' 카테고리의 다른 글

Javascript - 이론 : 순수함수, 일급함수  (0) 2019.03.15
5. 함수형 프로그래밍 - reduce  (0) 2019.03.15
Javascript - 클로져( Closure )  (0) 2019.03.14
4. 함수형 프로그래밍 - each  (0) 2019.03.14
3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14




function reduce( $list, $fn, $memo )
{
let memo = $memo;
each( $list, ( $item ) => memo = $fn( memo, $item ));

return memo;
}

function each( $list, $fn ){
for( let item of $list ){
$fn( item );
}
}

const add = ( a, b ) => a + b;
const minus = ( a, b ) => a - b;

console.log( reduce([ 1, 2, 3 ], add, 0 ));
console.log( reduce([ 1, 2, 3 ], minus, 6 ));


'frontend > Java Script' 카테고리의 다른 글

Javascript - 이론 : 순수함수, 일급함수  (0) 2019.03.15
6. 함수형 프로그래밍 - pipe  (0) 2019.03.15
Javascript - 클로져( Closure )  (0) 2019.03.14
4. 함수형 프로그래밍 - each  (0) 2019.03.14
3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14




function getData( $key ){
let data = [
{ name : "A", value : 37 },
{ name : "B", value : 21 },
{ name : "C", value : 15 },
{ name : "D", value : 21 },
{ name : "E", value : 33 }
]

return ( $index ) => data[ $index ][ $key ];
}

let name = getData( "name" );
console.log( name( 0 ));
console.log( name( 2 ));
console.log( name( 4 ));

let value = getData( "value" );
console.log( value( 0 ));
console.log( value( 2 ));
console.log( value( 4 ));


'frontend > Java Script' 카테고리의 다른 글

6. 함수형 프로그래밍 - pipe  (0) 2019.03.15
5. 함수형 프로그래밍 - reduce  (0) 2019.03.15
4. 함수형 프로그래밍 - each  (0) 2019.03.14
3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14
2. 함수형 프로그래밍 - map  (0) 2019.03.14




const users = [
{ isView : false, id : 1, name : "A", age : 36 },
{ isView : true, id : 2, name : "B", age : 32 },
{ isView : true, id : 3, name : "C", age : 31 },
{ isView : false, id : 4, name : "D", age : 27 },
{ isView : true, id : 5, name : "E", age : 25 },
{ isView : false, id : 6, name : "F", age : 31 }
];

function filter( $list, fn ){
let nList = [];

each( $list, ( $item ) => {
if( fn( $item )) nList.push( $item );
})

return nList;
}

function map( $list, fn ){
let nList = [];

each( $list, ( $item ) => nList.push( fn( $item )));

return nList;
}

function each( $list, fn ){
var item;
for( item of $list ){
fn( item );
}
}

let age = map(
filter( users, ( item ) => item.isView ),
( item ) => item.age );
let name = map(
filter( users, ( item ) => item.isView ),
( item ) => item.name );

let id = map(
filter( users, ( item ) => item.age >= 30 ),
( item ) => item.id );

console.log( age, name, id );


'frontend > Java Script' 카테고리의 다른 글

5. 함수형 프로그래밍 - reduce  (0) 2019.03.15
Javascript - 클로져( Closure )  (0) 2019.03.14
3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14
2. 함수형 프로그래밍 - map  (0) 2019.03.14
1. 함수형 프로그래밍 - Filter  (0) 2019.03.14




const users = [
{ isView : false, id : 1, name : "A", age : 36 },
{ isView : true, id : 2, name : "B", age : 32 },
{ isView : true, id : 3, name : "C", age : 31 },
{ isView : false, id : 4, name : "D", age : 27 },
{ isView : true, id : 5, name : "E", age : 25 },
{ isView : false, id : 6, name : "F", age : 31 }
];

function filter( $list, fn ){
let nList = [];
let item;

for( item of $list ){
if( fn( item )) nList.push( item );
}

return nList;
}

function map( $list, fn ){
let nList = [];
let item;

for( item of $list ){
nList.push( fn( item ));
}

return nList;
}

let age = map(
filter( users, ( item ) => item.isView ),
( item ) => item.age );
let name = map(
filter( users, ( item ) => item.isView ),
( item ) => item.name );

let id = map(
filter( users, ( item ) => item.age >= 30 ),
( item ) => item.id );

console.log( age, name, id );


'frontend > Java Script' 카테고리의 다른 글

Javascript - 클로져( Closure )  (0) 2019.03.14
4. 함수형 프로그래밍 - each  (0) 2019.03.14
2. 함수형 프로그래밍 - map  (0) 2019.03.14
1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29




const users = [
{ isView : false, id : 1, name : "A", age : 36 },
{ isView : true, id : 2, name : "B", age : 32 },
{ isView : true, id : 3, name : "C", age : 31 },
{ isView : false, id : 4, name : "D", age : 27 },
{ isView : true, id : 5, name : "E", age : 25 },
{ isView : false, id : 6, name : "F", age : 31 }
];

function map( $list, fn ){
let nList = [];
let item;

for( item of $list ){
nList.push( fn( item ));
}

return nList;
}

console.log( map( users, ( item ) => item.age ));
console.log( map( users, ( item ) => item.name ));
console.log( map( users, ( item ) => item.id ));


'frontend > Java Script' 카테고리의 다른 글

4. 함수형 프로그래밍 - each  (0) 2019.03.14
3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14
1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29
Video Tag Event  (0) 2017.10.30





const users = [
{ isView : false, id : 1, name : "A", age : 36 },
{ isView : true, id : 2, name : "B", age : 32 },
{ isView : true, id : 3, name : "C", age : 31 },
{ isView : false, id : 4, name : "D", age : 27 },
{ isView : true, id : 5, name : "E", age : 25 },
{ isView : false, id : 6, name : "F", age : 31 }
];

function filter( $list, fn ){
let nList = [];
let item;

for( item of $list ){
if( fn( item )) nList.push( item );
}

return nList;
}

console.log( filter( users, ( item ) => item.age >= 30 ));
console.log( filter( users, ( item ) => item.isView ));
console.log( filter( [ 5, 2, 1, 4, 6, 2 ], ( item ) => item < 3 ));


'frontend > Java Script' 카테고리의 다른 글

3. 함수형 프로그래밍 - filter + map  (0) 2019.03.14
2. 함수형 프로그래밍 - map  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29
Video Tag Event  (0) 2017.10.30
IE10 .val() 값 초기화 문제  (0) 2017.10.30
function Parent(){}
Parent.prototype.Show = function()
{
console.log( "Parent Show" ); // Parent Show 상속해서 사용
}

function A(){}
A.prototype = new Parent();

function B(){}
B.prototype = new Parent();

function C(){}
C.prototype = new Parent();
C.prototype.Show = function()
{
console.log( "C Show" ); // C 에서 Show 함수 캐치
}

var a = new A();
a.Show();

var b = new B();
b.Show();

var c = new C();
c.Show();


저작자표시 비영리 변경금지

'frontend > Java Script' 카테고리의 다른 글

2. 함수형 프로그래밍 - map  (0) 2019.03.14
1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
Video Tag Event  (0) 2017.10.30
IE10 .val() 값 초기화 문제  (0) 2017.10.30
모바일 위 아래 드래그 막기  (0) 2017.10.30



loadstart

브라우저가 미디어를 찾기 시작할때 발생


progress

브라우저가 미디어 데이터를 가져오는 중에 발생


suspend

브라우저가 현재 데이터를 전부 다 다운하지 않았는데 미디어 데이터를 가져오는 것이 멈췄을 때 발생


abort

브라우저가 에러가 아닌 상황에서 미디어 데이터를 가져오는 것을 멈췄을 때 발생


error

미디어 데이터를 가져오다가 에러가 발생햇을 때 발생


emptied

미디어의 networkState가 NETWORK_EMPTY상태로 들어가게 되었을 때 발생( 치명적인 오류로 멈추거나, 이미 리소스 선택 알고리즘이 실행중이었는데 load() 함수가 호출되었을 때 )


play

재생되었을 때, play() 함수가 리턴하고나서, autoplay로 인해 재생이 시작되었을 때 호출


pause

미디어가 일시정지 되었을 때 발생( pause() 함수가 리턴 되고나서 발생 )


loadedmetadata

브라우저가 미디어의 길이와 넓이, 높이의 메타정보를 가져왔을 때 발생


loadeddata

브라우저가 현재 재생위치에서 미디어 정보를 뿌릴 수 있는 상태로 준비되면 발생


waiting

다음 프레임이 로드되지 않아서 재생이 멈추었을 때 발생, 브라우저는 곧 프레임이 가능해질 것이라고 예상하고 있음


playing

재생이 시작되었을 때 발생


canplay

브라우저가 미디어 데이터의 재생이 가능해질 때 발생, 하지만 지금 재생이 시작하면 이후 버퍼링 속도가 느려서 다시 멈추지 않고 재생이 불가할것이라고 측정함


canplaythrough

브라우저가 현재 재생을 시작하면, 버퍼링 속도와 재생 속도를 고려했을 때 끝까지 멈추지 않고 재생 가능할 것이라고 측정함


seeking

seek 동작이 길게 유지되어서 브라우저에서 이벤트 발생이 될정도가 되었을 때 발생


seeked

seeking이 끝나면 발생


timeupdate 

현재 재생위치가 바뀌었을 때 발생


ended

미디어의 끝에 도달해서 재생이 멈추었을 때 발생


ratechange

defaultPlaybackRate나 playbackRate의 속성이 변경되었을 때 발생


durationchange

duration 속성이 바뀌었을 때 발생


volumechange

volume 속성이 변하거나 muted 속성이 변했을 때 발생

저작자표시 비영리 변경금지

'frontend > Java Script' 카테고리의 다른 글

1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29
IE10 .val() 값 초기화 문제  (0) 2017.10.30
모바일 위 아래 드래그 막기  (0) 2017.10.30
Module Pattern + Ajax  (0) 2017.10.30

textarea에 .val()값을 설정할 경우,

.val()값이 초기화 되는 버그가 발생한다.



.val()를 설정하기전에 .blur() 발생 후,

값을 주면 정상 작동한다.




<!DOCTYPE html>

<html lang="ko">

    <head>

        <title>TEST</title>

        <meta charset="utf-8">

    </head>


    <body>

        <textarea></textarea>


        <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

        <script>

            $( document ).ready( function(){

                

                ( function init()

                {

                    create();

                })();


                function create()

                {

                    $( "textarea" ).on( "keyup", keyUpListener );


                    function keyUpListener( $e )

                    {

                        var val = $( this ).val();


                        $( this ).blur();

                        $( this ).val( val );

                        $( this ).focus();

                    }

                }

            });

        </script>

    </body>

</html>

저작자표시 비영리 변경금지

'frontend > Java Script' 카테고리의 다른 글

1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29
Video Tag Event  (0) 2017.10.30
모바일 위 아래 드래그 막기  (0) 2017.10.30
Module Pattern + Ajax  (0) 2017.10.30



모바일 web page 에서 

위 아래 드래그를 막아야할 필요가 있다.


var _isDrag = false;

$( document ).on( "touchmove", touchMoveListener );


touchMoveListener( $e )

{

return _isDrag;

}



_isDrag를 true로 하면 위아래 드래그가 가능하며

false 면 드래그가 막힌다.


상황에 따라 _isDrag 값을 변경하면 된다.

저작자표시 비영리 변경금지

'frontend > Java Script' 카테고리의 다른 글

1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29
Video Tag Event  (0) 2017.10.30
IE10 .val() 값 초기화 문제  (0) 2017.10.30
Module Pattern + Ajax  (0) 2017.10.30





전역 방지 모듈패턴과 jQuery Ajax 기본 예제를 만들어 보았습니다.



https://github.com/JSzeronine/20170914_ajax/tree/master/js




- App.js 


모듈 및 전역 변수, 이벤트를 관리합니다.


- App.index.js


전체 컨텐츠를 관리합니다.

이벤트 수신 및 Controller를 관리합니다.


- App.server.js


모든 데이터 관리

저작자표시 비영리 변경금지

'frontend > Java Script' 카테고리의 다른 글

1. 함수형 프로그래밍 - Filter  (0) 2019.03.14
javascript prototype - 상속  (0) 2018.03.29
Video Tag Event  (0) 2017.10.30
IE10 .val() 값 초기화 문제  (0) 2017.10.30
모바일 위 아래 드래그 막기  (0) 2017.10.30

+ Recent posts

티스토리툴바