1. Introduction
This blog is about the Javascript "for of" loop and the Javascript destructuring assignment.
These are part of ECMAScript 6 features that were included in the ECMAScript 7 update of AppStudio 3.3 and Qt 5.12.1.
We explore how these features may help with your AppStudio apps.
2. The "for of" loop
Traditionally, to loop through an array we need to use an index variable (e.g. i):
<SPAN class="keyword token">var</SPAN> census <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"France"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">66.99</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Australia"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">24.6</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"United States"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">327.2</SPAN> <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">]</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> i <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN> i <SPAN class="operator token"><</SPAN> census<SPAN class="punctuation token">.</SPAN>length<SPAN class="punctuation token">;</SPAN> i<SPAN class="operator token">++</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">var</SPAN> item <SPAN class="operator token">=</SPAN> census<SPAN class="punctuation token">[</SPAN>i<SPAN class="punctuation token">]</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> item<SPAN class="punctuation token">.</SPAN>country<SPAN class="punctuation token">,</SPAN> item<SPAN class="punctuation token">.</SPAN>population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
In ECMAScript 6, we can use "for of" loop to make this easier:
<SPAN class="keyword token">let</SPAN> census <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"France"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">66.99</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Australia"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">24.6</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"United States"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">327.2</SPAN> <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">]</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> item <SPAN class="keyword token">of</SPAN> census <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> item<SPAN class="punctuation token">.</SPAN>country<SPAN class="punctuation token">,</SPAN> item<SPAN class="punctuation token">.</SPAN>population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
The "for of" loop is new in ECMAScript 6 and created specifically for looping through arrays and, in general, Javascript iterators.
3. Unpacking object values
Since we know each item have country and population fields, we can use the new ECMAScript destructuring assignment operator to extract it:
<SPAN class="keyword token">let</SPAN> census <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"France"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">66.99</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Australia"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">24.6</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"United States"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">327.2</SPAN> <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">]</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> item <SPAN class="keyword token">of</SPAN> census <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">}</SPAN> <SPAN class="operator token">=</SPAN> item
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
We can even mix destructuring assignment with "for of":
<SPAN class="keyword token">let</SPAN> census <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"France"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">66.99</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Australia"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">24.6</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"United States"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">327.2</SPAN> <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">]</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">of</SPAN> census <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
You can get creative by combining this with arrow functions:
<SPAN class="keyword token">let</SPAN> census <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"France"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">66.99</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Australia"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">24.6</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"United States"</SPAN><SPAN class="punctuation token">,</SPAN> population<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">327.2</SPAN> <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">]</SPAN>
<SPAN class="keyword token">let</SPAN> orderByPopulationDesc <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">(</SPAN>a<SPAN class="punctuation token">,</SPAN> b<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN> <SPAN class="operator token">-</SPAN><SPAN class="punctuation token">(</SPAN>a<SPAN class="punctuation token">.</SPAN>population <SPAN class="operator token">-</SPAN> b<SPAN class="punctuation token">.</SPAN>population<SPAN class="punctuation token">)</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">of</SPAN> census<SPAN class="punctuation token">.</SPAN><SPAN class="token function">sort</SPAN><SPAN class="punctuation token">(</SPAN> orderByPopulationDesc <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
4. Unpacking arrays values
Similarly, you can unpack arrays using the following destructuring assignment syntax:
<SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">[</SPAN> year<SPAN class="punctuation token">,</SPAN> month<SPAN class="punctuation token">,</SPAN> day <SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN> <SPAN class="string token">"2019"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"11"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"07"</SPAN> <SPAN class="punctuation token">]</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN>year<SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 2019</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN>month<SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 11</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN>day<SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 07</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
5. Unpacking regular expression capture groups
When you use "str.match" with regular expression you get an array of strings. You get additional strings in the array for each capture group. You need to process the array to extract each capture group, e.g.
<SPAN class="keyword token">let</SPAN> str <SPAN class="operator token">=</SPAN> <SPAN class="string token">"2019-11-07"</SPAN>
<SPAN class="keyword token">let</SPAN> m <SPAN class="operator token">=</SPAN> str<SPAN class="punctuation token">.</SPAN><SPAN class="token function">match</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="regex token">/(\d{4})-(\d{2})-(\d{2})/</SPAN> <SPAN class="punctuation token">)</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> m<SPAN class="punctuation token">.</SPAN>length <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 4</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> m<SPAN class="punctuation token">[</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 2019-11-07</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> m<SPAN class="punctuation token">[</SPAN><SPAN class="number token">1</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 2019</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> m<SPAN class="punctuation token">[</SPAN><SPAN class="number token">2</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 11</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> m<SPAN class="punctuation token">[</SPAN><SPAN class="number token">3</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 07</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
The Javascript destructuring assignment here helps eliminate the need for having an intermediate array variable. The code becomes much shorter and clearer:
<SPAN class="keyword token">let</SPAN> str <SPAN class="operator token">=</SPAN> <SPAN class="string token">"2019-11-07"</SPAN>
<SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">[</SPAN> <SPAN class="punctuation token">,</SPAN> year<SPAN class="punctuation token">,</SPAN> month<SPAN class="punctuation token">,</SPAN> day <SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> str<SPAN class="punctuation token">.</SPAN><SPAN class="token function">match</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="regex token">/(\d{4})-(\d{2})-(\d{2})/</SPAN><SPAN class="punctuation token">)</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> year <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 2019</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> month <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 11</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> day <SPAN class="punctuation token">)</SPAN> <SPAN class="comment token">// 07</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
6. Using destructuring assignment with SQL
In the following example, we see that the destructuring assignment is useful in unpacking results from SQL queries:
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">open</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"CREATE TABLE IF NOT EXISTS countries (country TEXT, population NUMBER)"</SPAN> <SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"INSERT INTO countries VALUES ( 'France', 66.99 )"</SPAN> <SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"INSERT INTO countries VALUES ( 'Australia', 24.6 )"</SPAN> <SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"INSERT INTO countries VALUES ( 'USA', 327.2 )"</SPAN> <SPAN class="punctuation token">)</SPAN>
<SPAN class="keyword token">let</SPAN> q <SPAN class="operator token">=</SPAN> db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"SELECT * FROM countries"</SPAN> <SPAN class="punctuation token">)</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> ok <SPAN class="operator token">=</SPAN> q<SPAN class="punctuation token">.</SPAN><SPAN class="token function">first</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">;</SPAN> ok <SPAN class="punctuation token">;</SPAN> ok <SPAN class="operator token">=</SPAN> q<SPAN class="punctuation token">.</SPAN><SPAN class="token function">next</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">}</SPAN> <SPAN class="operator token">=</SPAN> q<SPAN class="punctuation token">.</SPAN>values
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN>
q<SPAN class="punctuation token">.</SPAN><SPAN class="token function">finish</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">close</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
We can use "for of" syntax here if we make use of Javascript iterator and Javascript generator syntax:
<SPAN class="keyword token">function</SPAN><SPAN class="operator token">*</SPAN> <SPAN class="token function">queryIterator</SPAN><SPAN class="punctuation token">(</SPAN>q<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> ok <SPAN class="operator token">=</SPAN> q<SPAN class="punctuation token">.</SPAN><SPAN class="token function">first</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">;</SPAN> ok <SPAN class="punctuation token">;</SPAN> ok <SPAN class="operator token">=</SPAN> q<SPAN class="punctuation token">.</SPAN><SPAN class="token function">next</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">)</SPAN>
<SPAN class="keyword token">yield</SPAN> q<SPAN class="punctuation token">.</SPAN>values
<SPAN class="punctuation token">}</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">open</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"CREATE TABLE IF NOT EXISTS countries (country TEXT, population NUMBER)"</SPAN> <SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"INSERT INTO countries VALUES ( 'France', 66.99 )"</SPAN> <SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"INSERT INTO countries VALUES ( 'Australia', 24.6 )"</SPAN> <SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"INSERT INTO countries VALUES ( 'USA', 327.2 )"</SPAN> <SPAN class="punctuation token">)</SPAN>
<SPAN class="keyword token">let</SPAN> q <SPAN class="operator token">=</SPAN> db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="string token">"SELECT * FROM countries"</SPAN> <SPAN class="punctuation token">)</SPAN>
<SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">let</SPAN> <SPAN class="punctuation token">{</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">of</SPAN> <SPAN class="token function">queryIterator</SPAN><SPAN class="punctuation token">(</SPAN> q <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">log</SPAN><SPAN class="punctuation token">(</SPAN> country<SPAN class="punctuation token">,</SPAN> population <SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN>
q<SPAN class="punctuation token">.</SPAN><SPAN class="token function">finish</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
db<SPAN class="punctuation token">.</SPAN><SPAN class="token function">close</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
We will talk more about Javascript iterators and Javascript generators in a future blog.
7. Conclusion
This blog introduces Javascript "for of" loop and Javascript destructuring assignments.
These are some of the new Javascript ECMAScript 7 syntax improvements in AppStudio 3.3 and Qt 5.12.1 that can help you improve your code readability, clarity by helping you write shorter, easier to maintain code.
These syntax improvements complement other Javascript improvements, such as Javascript iterators, Javascript generators and Javascript promises.
We will introduce Javascript iterators and Javascript generators in a future blog.
We will revisit Javascript promises and how they fit with all these Javascript syntax improvements.
