Responsive Advertisement

JavaScript #5: Strict mode in JavaScript

 

Can you imagine how terrible it would be if a country had no laws? People do whatever they want without thinking about the consequences. Society will be in turmoil.

In JavaScript, too, there is a need for legislation to make sure everything works the way it should. In default mode, non-strict mode reffered as “sloppy mode”. Also operated everything according to JavaScript's own laws.

But now you need an extra upgrade to make sure the error is as minimal as possible. You will use “strict mode” in JavaScript.

Table of contents:

·       How to add strict mode

·       Benefit to use strict mode

·       Cases about use strict mode

·       Keywords are not allowed

How to add strict mode

To use strict mode we have the following ways: 'use strict' – 'use strict'; - “use strict” – “use strict”;

Notion: you must precede all lines of code in the global scope environment or in the local scope environment. Let strict mode take effect.

Let's look at an example to understand how to use strict mode in JavaScript.

Here's how to use it in a global environment.

'use strict'

 

x = 10

 

console.log(x) // => Uncaught ReferenceError: assignment to undeclared variable x

This is in functions.

function scope() {

    'use strict'

    x = 10

    console.log(x)

    // => ReferenceError: assignment to undeclared variable x

}

scope()

So, what about in scope, or not putting 'use strict' in the first line, what will happen?


'use strict'

x = 10

console.log(x) // => 10

}


x = 10

'use strict'

console.log(x) // => 10

So, note that in scope or 'use strict' not set on other lines of code will have no effect.

Benefits of using strict mode:

As the examples above, when in normal mode we can hardly detect small errors. In strict mode will help us to throw errors, so as not to encounter confusing bugs.

When you have minimized bugs in the system. The JavaScript engine will work better to make the program faster.

In addition, the system will predict some errors in future of versions ECMAScript. Rely on variable naming on words that might be used in the future. This part will be covered in the next section.

Cases about use strict mode

So, strict mode works and prohibits the problems we'll see in the following examples.

Prohibit assignment to undeclared variable local

strict = 'strict'

console.log(strict) // => strict

 

function useStrict() {

    'use strict'

    local = 'local'

    console.log(local) // => ReferenceError: assignment to undeclared variable local

}

useStrict()

Use object without declare

objGlobal = { name: 'global' }

console.log(objGlobal.name) // => global

 

function useStrict() {

'use strict'

    x = { p1: 10, p2: 20 }

    console.log(x) // => ReferenceError: assignment to undeclared variable x

}

useStrict()

Delete a variable (or object) without declare

objGlobal = { name: 'global' }

console.log(objGlobal.name) // => global

 

function useStrict() {

    'use strict'

    objGlobal = { name: 'local' }

    delete objGlobal // => Uncaught SyntaxError: applying the 'delete' operator to an unqualified name is deprecated

}

useStrict()

The same as delete function in JavaScript.

Duplicate parameter is not allowed

'use strict'

function useStrict(a, a, b) {

    console.log(a, a, b)

    // => Uncaught SyntaxError: duplicate formal argument a

}

useStrict() 

Octal numeric literals is not allowed

Example of octal numbers in JavaScript: 0123, -0921, 032

'use strict'

function useStrict() {

    let strict = 01023

    console.log(strict)

    // => Uncaught SyntaxError: "0"-prefixed octal literals are deprecated; use the "0o" prefix instead

}

useStrict() 

Octal escape character is not allowed

Someone can think if we add octal escape to replace for octal number in strict mode. Maybe it works?

'use strict'

function useStrict() {

    let strict = '\01023'

    console.log(strict)

    // => Uncaught SyntaxError: octal escape sequences can't be used in untagged template literals or in strict mode code

}

useStrict() 

Writing to a read-only (or get only) is not allowed

const globalObj = {}

Object.defineProperty(globalObj, 'x', { value: 10, writable: false })

globalObj.x = 1000 // => Success

 

function localScope() {

    'use strict'

    const obj = {}

    Object.defineProperty(obj, 'x', { value: 10, writable: false })

    obj.x = 1000 // => Uncaught TypeError: "x" is read-only

}

localScope()

Delete undeletable property is not allowed

delete Object.prototype // => Nothing happened

 

function useStrict() {

    'use strict'

    delete Object.prototype

    // => Uncaught TypeError: property "prototype" is non-configurable and can't be deleted

}

useStrict()

Use words “eval, arguments” is not allowed

let eval = 'eval'

console.log(eval) // => eval

 

let arguments = 'arguments'

console.log(arguments) // => arguments

 

function useStrict() {

    'use strict'

    let eval = 'eval'

    console.log(eval)

    // 'eval' can't be defined or assigned to in strict mode code

 

    let arguments = 'arguments'

    console.log(arguments)

    // 'arguments' can't be defined or assigned to in strict mode code

}

useStrict()

Use "with" state is not allowed

with (Math) {

    console.log(PI) // => 3.141592653589793

}

 

function useStrict() {

    'use strict'

    with (Math) {

        console.log(PI)

        // => Uncaught SyntaxError: strict mode code may not contain 'with' statements

    }

}

useStrict()

“This” is refferented diffirently in strict mode. I will have an article about “this in next time”.

Keywords are not allowed

Some keywords are future proof is not allowed

Implement

Interface

Let

Package

Private

Protected

Public

Static

Yeild

Conclusion

We went through how to strict mode works in JavaScript. Strict mode help prevent some hidden bugs in system. Make your system run faster and with as few errors as possible. You might consider always using strict mode while coding JavaScript.

If you have any comments, few free to comment below. Thank you for joining with me. Have a good day!






Đăng nhận xét

0 Nhận xét