The Trouble with Dots

In many dynamic languages, you can access parts of structures like Objects, Arrays, and class instances through ., the dot operator. Normally that works great:

const person = {
    firstName: 'Jesse',
    lastName: 'Warden',
    age: 39,
    address: {
        home: {
            street: '007 Cow Lane',
            phone: ['123-456-7890']
        work: {
            street: '123 Work Blvd'

To access the firstName property on the person, I just use a dot accessor:

console.log(person.firstName) // Jesse

If you misspell a property, no worries:

console.log(person.fistName) // undefined

If you misspell the object, though:

console.log(persn.fistName) // ReferenceError: persn is not defined

The second comes from accessing a sub property you THINK exists, but doesn't such as mispelling home to hom:

console.log(person.address.hom.street) // TypeError: Cannot read property 'street' of undefined

You spelled street right. However, you could of spelled it wrong. Either way, what the error MEANT to say was: "There is no hom property on person.address, perhaps you meant home?".

As you see, reading data through dots is dangerous. These errors are with a known Object. Often you're dealing with data that isn't known, coming from external sources like REST calls, text files, databases, etc. These are side effects that you can't control.

results matching ""

    No results matching ""