Broad Network


Testing ECMAScript 2015 Code as you write

ECMAScript Basics - Part 15

ECMAScript 6

Foreword: In this part of the series, I explain how you can be testing your ECMAScript code as you write the code.

By: Chrysanthus Date Published: 12 May 2016

Introduction

This is part 15 of my series, ECMAScript Basics. In this part of the series, I explain how you can be testing your ECMAScript code as you write the code. Assume you have a page long of ECMAScript code and there is one syntax error there. Just because of that one error, the whole page code will not be executed. Matters are made worse if there are more than one error. All your ECMAScript code will be executed, only if there is no syntax error. As you can see, there is need for you to be testing your code as you write it.

Solution
The solution is to be writing your ECMAScript code in segments. A segment consists of an average of 5 lines. So when you just finish writing a segment, add an error checker. Then you test the whole code, by running the web page. If the code works, you remove the error checker and write the next segment, which also ends with an error checker. If the code did not work, make correction in the segment and run the whole code (web page) again, while the error checker stays there. If it still does not work, make another correction and keep running the whole code and making correction, until the error or errors is/are removed. When all errors in the segment are removed, remove the error checker, and then if necessary, write the next segment with its own error checker.


Illustration
Consider the following script with one code segment:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>

    <script type="text/ECMAScript">

        aa0 = "AAA";
        bb1 = "BBB";
        cc2 = "CCC";
        dd3 = "DDD";
        4ee = "EEE";
        alert('seen');

    </script>

</body>
</html>

The extra HTML code is to produce a web page. An identifier (variable) can start with a letter or underscore, but cannot start with a number. The last identifier above starts with a number and so the whole script code cannot be executed. The error checker is the last line:

        alert('seen');

There are 5 statements in the segment of interest. If there is any error, as there is in the segment, the alert box will not be displayed, because it is part of the code, and any error in the code makes the whole code not to execute. If there is no error in the segment, the alert box will be displayed.

That is how you code segments, one after another with the error checker. For all the segments that have been written, only one error checker should be present in the whole code. As soon as the error or errors in a segment have been removed, you remove the error checker. The error checker should only be in (at the end of) the current segment. At the end of complete coding, when there is no error in the whole script, there should be no error checker.

The Error Checker
A simple error checker like the one above, (typed next) can be used for most of your programs (scripts):

        alert('seen');

Checking Errors in Functions
With functions, first you write the outline of the function as a segment, something like:

    function ident(param1, param2)
        {
        
        }
    alert('seen');

If there is any error in the outline of this segment, it should be solved. Note the error checker at the end of the outline. After solving you removed the error checker. Next you write the statements in the function body (block) segment by segment, with the current segment having the error checker, something like:

    function ident(param1, param2)
        {
            aa0 = "AAA";
            bb1 = "BBB";
            cc2 = "CCC";
            dd3 = "DDD";
            4ee = "EEE";
            alert('seen');    
        }

You solve any problem, segment by segment, within the function, as before.

That is it for this part of the series.

Chrys

Related Links

ECMAScript Basics
ECMAScript Operators
Expressions in ECMAScript
Statements in ECMAScript
Custom Objects in ECMAScript
Functions in ECMAScript
ECMAScript Date Object
The ECMAScript String Object
ECMAScript String Regular Expressions
ECMAScript Template Literal
The ECMAScript Array
ECMAScript Sets and Maps
ECMAScript Number
Scopes in ECMAScript
Mastering the ECMAScript (JavaScript) eval Function
Sending Email with ECMAScript
ECMAScript Insecurities and Prevention
Advanced Course
Advanced ECMAScript Regular Expressions
Promise in ECMAScript 2015
Generator in ECMAScript 2015
ECMAScript Module
More Related Links
Node Mailsend
EMySQL API
Node.js Web Development Course
Major in Website Design
Low Level Programming - Writing ECMAScript Module
ECMAScript Course

BACK

Comments

Become the Writer's Follower
Send the Writer a Message