Rapid ES6 Training: The Proxy API

mark-zamoyta-v1

Welcome to the final part of this review of the Pluralsight course Rapid ES6 Training by Mark Zamoyta.

Mark started in the developer world over 25 years ago.

He has written numerous mobile apps and games for clients including Electronic Arts and Yahoo! Games.

Rapid ES6 Training is the final course in the new JavaScript learning path.

The aim of the course is for you to be able to use the new syntax and features of ES6, and the prerequisite is to be familiar with the earlier ES5 version of JavaScript.

The Proxy API

Defining Proxies

This is the first part of the course that moves away from console logging examples. We see a slide explaining the Proxy Terminology.

We wrap an object or function within a handler object, which is our proxy.

The handler has traps, which are responsible for managing access to the target function.

Mark explains all the the Traps are the same as what we learned for the Reflect API in the previous module:

get()
set()
apply()

Our proxy or handler object can do validation logic and only set a value on the target object if the value meets the rules we code here.

Available Traps

This looks a lot like the Reflect object:

handler.construct()
handler.apply()

handler.getPrototypeOf()
handler.setPrototypeOf()

handler.get()
handler.set()
handler.has()
handler.ownKeys()

handler.defineProperty()
handler.deleteProperty()
handler.getOwnPropertyDescriptor()

handler.preventExtensions()
handler.isExtensible()

Mark also explains untrappable Object usage. We can’t trap comparisons, typeof, instanceof, or operations such as addition with +, and we can’t see if String is wrapping the object.

Get by Proxy

We see an example of using the get method on Proxy where we just return a message and log it.

Mark also shows an example where we access a salary property through the proxy, and log the salary of the target object to the console.

We also see an example where we are denied from accessing the salary property.

nostairwaytoheaven

But can access any other property on the object.

bill-ted-wyld-stallyns

Calling Functions by Proxy

In this lesson we see an example of using the apply method of the proxy. This just passes our arguments through using the Reflect API.

Any API function from the Reflect object can be used as a trap.

A Proxy as a Prototype

We can use a Proxy as a Prototype:

var t = {
    tableId: 99
}
var p = new Proxy({}, {
        get: function (target, prop, receiver) {
                return 'Property ' + prop + ' doesn\'t exist...'
        }
});

Object.setPrototypeOf(t, p);

console.log(t.tableId);
console.log(t.size);

Revocable Proxies

We might not want our Proxy to last forever. If data changes or security settings change, we would want to prevent access to it:

Proxy.revocable(...)

Mark shows an example of creating a revokable proxy. Once created, we call the revoke() function. If we try to call it after it has been revoked, we see the error “Property size doesn’t exist”

That is the end of this course. In the summary, Mark reminds us again of how useful Kangax’s ES6 compatibility table is.

Verdict

Thanks very much to Mark Zamoyta for producing this course. Even though I had watched two previous courses on ES6, I found that it covered a lot of material that wasn’t covered before.

If some of the topics in this review aren’t already familiar to you, I highly recommend watching this course.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s