File tree Expand file tree Collapse file tree
Expand file tree Collapse file tree Original file line number Diff line number Diff line change 1+ # JavaScript Proxy
2+
3+ > [ https://youtu.be/gZ4MCb2nlfQ ] ( https://youtu.be/gZ4MCb2nlfQ )
4+
5+ Install [ Node.js] ( https://nodejs.org/ ) .
6+
7+ Within this folder run the terminal command ` npm install ` to install the
8+ ` dependencies ` and ` devDependencies ` .
9+
10+ Then run ` npm start ` to run the app viewable on ` http://localhost:9966 ` .
Original file line number Diff line number Diff line change 1+
2+ const IndexedArray = new Proxy ( Array , {
3+ construct : function ( target , [ originalArray ] ) {
4+ const index = { }
5+ originalArray . forEach ( function ( item ) {
6+ index [ item . id ] = item
7+ } )
8+
9+ const newArray = new target ( ...originalArray )
10+
11+ return new Proxy ( newArray , {
12+ get : function ( target , name ) {
13+ if ( name === 'push' ) {
14+ return function ( item ) {
15+ index [ item . id ] = item
16+ return target [ name ] . call ( target , item )
17+ }
18+ } else if ( name === 'findById' ) {
19+ return function ( searchId ) {
20+ return index [ searchId ]
21+ }
22+ }
23+ return target [ name ]
24+ }
25+ } )
26+ }
27+ } )
28+
29+ const bears = new IndexedArray ( [
30+ {
31+ id : 2 ,
32+ name : 'grizzly' ,
33+ } ,
34+ {
35+ id : 4 ,
36+ name : 'black' ,
37+ } ,
38+ {
39+ id : 3 ,
40+ name : 'polar' ,
41+ } ,
42+ ] )
43+
44+ bears . push ( {
45+ id : 55 ,
46+ name : 'brown'
47+ } )
48+
49+ const brown = bears . findById ( 55 )
50+ console . log ( brown )
51+ console . log ( bears . findById ( 3 ) )
52+
53+ // const index = {}
54+ // bears.forEach(function (bear) {
55+ // index[bear.id] = bear
56+ // })
57+ //
58+ // const polar = index[3]
59+ // const black = index[4]
Original file line number Diff line number Diff line change 1+ let bears = { grizzly : true }
2+
3+ let grizzlyCount = 0
4+
5+ const proxyBears = new Proxy ( bears , {
6+ get : function ( target , prop ) {
7+ if ( prop === 'grizzly' ) grizzlyCount ++
8+ return target [ prop ]
9+ } ,
10+ set : function ( target , prop , value ) {
11+ if ( [ 'grizzly' , 'brown' , 'polar' ] . indexOf ( prop ) === - 1 ) {
12+ throw new Error ( 'THAT IS TOTALLY NOT A BEAR!' )
13+ }
14+ target [ prop ] = value
15+ } ,
16+ deleteProperty : function ( target , prop ) {
17+ console . log ( `You have deleted ${ prop } ` )
18+ delete target [ prop ]
19+ }
20+ } )
21+
22+ //proxyBears.aardvark = true
23+ proxyBears . polar = true
24+ //delete proxyBears.polar
25+ //console.log(proxyBears.polar)
26+
27+ // proxyBears.grizzly
28+ // proxyBears.grizzly
29+ // proxyBears.grizzly
30+ // proxyBears.grizzly
31+ // console.log(grizzlyCount)
32+
33+ function growl ( ) {
34+ return 'grrr'
35+ }
36+ const loudGrowl = new Proxy ( growl , {
37+ apply : function ( target , thisArg , args ) {
38+ return target ( ) . toUpperCase ( ) + '!!!'
39+ }
40+ } )
41+
42+ console . log ( loudGrowl ( ) )
43+
44+
45+
46+
47+
48+
49+
50+
51+
52+
53+
Original file line number Diff line number Diff line change 1+ {
2+ "name" : " javascript-proxy" ,
3+ "version" : " 0.1.0" ,
4+ "description" : " " ,
5+ "main" : " index.js" ,
6+ "dependencies" : {},
7+ "devDependencies" : {
8+ "budo" : " ^9.1.0"
9+ },
10+ "scripts" : {
11+ "start" : " budo array.js --live" ,
12+ "test" : " node test.js"
13+ },
14+ "author" : " Kyle Robinson Young <kyle@dontkry.com> (http://dontkry.com)" ,
15+ "license" : " MIT"
16+ }
Original file line number Diff line number Diff line change 1+ const person = {
2+ first : 'Bear' ,
3+ last : 'McBearison'
4+ }
5+
6+ const cleverPerson = new Proxy ( person , {
7+ get : function ( target , prop ) {
8+ if ( ! ( prop in target ) ) {
9+ return prop . split ( '_' ) . map ( function ( part ) {
10+ return target [ part ]
11+ } ) . join ( ' ' )
12+ }
13+ return target [ prop ]
14+ }
15+ } )
16+
17+ console . log ( cleverPerson . last_first_first_first_first_first )
18+
19+ cleverPerson . last = 'Beary'
20+ console . log ( cleverPerson . first_last )
You can’t perform that action at this time.
0 commit comments