SenchaCmd 7.8

Luca Minuti - May 22 - - Dev Community

Anyone who uses ExtJS knows SenchaCmd: a tool that allows automating numerous operations necessary during development with ExtJS. One of its main features is creating the production version of the WebApp we are building.

This task involves a certain degree of transformation of the JavaScript code:

  • Preprocessing of the code
  • Transpilation of the code for compatibility with older browser versions
  • Merging all sources (including ExtJS itself) into a single file
  • Compression (minification) of the files

All these operations require SenchaCmd to understand the JavaScript code, and unfortunately, until version 7.7, some features introduced in JavaScript in recent years are not supported.

Modern JavaScript

Since ES6 (introduced in 2015) numerous features have been added to the standard year by year. Below, I have included an entirely arbitrary list of ES6+ features, highlighting which do not work with SenchaCmd and which work starting from version 7.8.

Spread operator (ES6)

👍 Compatible even with older versions of SenchaCmd.

Allows you to "spread" an array as if it were a list of variables.

    const q1 = ["Jan", "Feb", "Mar"];
    const q2 = ["Apr", "May", "Jun"];
    const q3 = ["Jul", "Aug", "Sep"];
    const q4 = ["Oct", "Nov", "May"];

    const year = [...q1, ...q2, ...q3, ...q4];
    console.log(year);
Enter fullscreen mode Exit fullscreen mode

Destructuring assignment syntax (ES6)

📣 Supported starting from SenchaCmd 7.8!

Allows assigning the elements of an array or object to a series of variables in a single operation.

    let [a, b] = [1, 2];
    console.log(a, b);

    let {k, w} = { k:1, w:2 };
    console.log(k, w);
Enter fullscreen mode Exit fullscreen mode

Exponentiation Operator (ES2016)

⚠️ DOES NOT WORK EVEN WITH 7.8!

Allows the use of the "power" operator.

    const x = 5 ** 2;
    console.log(x);
Enter fullscreen mode Exit fullscreen mode

Async/await (ES2017)

👍 Compatible even with older versions of SenchaCmd.

Allows using Promises as if they were synchronous functions.

    const response = await fetch('/');
    console.log(response.statusText);
Enter fullscreen mode Exit fullscreen mode

JavaScript Object Rest Properties (ES2018)

📣 Supported starting from SenchaCmd 7.8!

Extends the destructuring assignment functionality to retrieve values not included in the list into an array.

    let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
    console.log(x,y,z);
Enter fullscreen mode Exit fullscreen mode

Optional catch Binding (ES2019)

⚠️ DOES NOT WORK EVEN WITH 7.8!

Allows handling all exceptions without specifying the type.

    try {
        // code
    } catch {
        // code
    }
Enter fullscreen mode Exit fullscreen mode

The optional chaining operator (ES2020)

📣 Supported starting from SenchaCmd 7.8!

Allows reading a property from a null or undefined object without throwing an exception.

    const test = {
        dog: {
            name: 'Pluto'
        }
    };
    console.log(test.cat?.name);
    console.log(test.dog?.name);
Enter fullscreen mode Exit fullscreen mode

The nullish coalescing operator (ES2020)

📣 Supported starting from SenchaCmd 7.8!

Returns the first non-null value from a list.

    const foo = null ?? "default string";
    console.log(foo);
Enter fullscreen mode Exit fullscreen mode
. . . . . . . . . . . .