patternjavascriptMinor

Get table/rows from database then insert into JavaScript

Submitted by: @import:stackexchange-codereview·Mar 10, 2026·

Viewed 0 times

rowsinsertjavascriptintodatabasegetthenfromtable

Problem

I'd rather not use this long code. I want to retrieve table/rows from database and insert into JavaScript to create a table in HTML.

This is what it looks like so far and I'd like to keep the design if possible:

https://i.stack.imgur.com/rDUqk.jpg

var time = 10
var wrongs = 0;
var wrongs2 = 0;
var next = 0;
var right = 0;
var right2 = 0;
function timer(){ 
 if(!time

Quiz

Home

Quiz

Study

Facebook

Romanji
ひらがな｜カタカナ｜漢字
English

`

Solution

Global Variables: All the variables defined are global, which is bad practice. Avoid declaring global variables. Wrap the code in IIFE and define variables using var keyword.

Naming Conventions: The names of the variable should give indication of it's purpose. The names should be in camelCase format.

Caching: Cache the DOM element reference and use it. This will save the time to dive into DOM again.

Missing Semicolons: Although, this will not cause any errors since JavaScript's Automatic Semicolon Insertion(ASI) will add the semicolons, it's good practice to add them. Also, depending on ASI can cause the semicolon to add someplace where the symantic will be changes. Ex: When declaring multiple variables if we forgot a comma, the successive variables will be declared as Global.

Comparison: To compare variables use strict comparison operators(=== and !==). Loose comparison will cast the operands before comparing variables which could lead into unexpected behavior.

Using else if ladder: For mutually exclusive conditions, use else if. If the condition is satisfied, the next conditions in else if are not executed. Or switch statement can also be used.

Nested for: Use nested for loops to iterate over the ` and update the values of each cell.(table())

Appending Markup: Instead of appending markup(like element in refresh()), IF POSSIBLE, add the markup in the HTML and only update the text-content of the element through JavaScript. This will avoid adding multiple nested elements if the function is repeatedly called.

Comparing Variables: !time = 1 which is more readable and easy to understand. Also, this will save an operation(Logical Not).

Using string parameter to setInterval: Don't use string parameter to the setInterval and setTimeout functions. You can pass the function reference as setInterval(timer, 1000)

Un-Needed Code: In stop() first next variable is assigned to zero and then it is compared with zero which is always going to evaluate as true. The if condition is not necessary there.

Similar Functions: The functions changepw() and logout() are similar. Both are redirecting to some page. This can be combined into one function redirect(url) accepting a parameter as redirect URL and redirect to that URL. Same is with disable() and enable() functions.

Logical Error & Dead Code: The expression Math.floor(Math.random() * 17) + 1 will always produce value between one and seventeen. So, the code written for comparing it 18 through 22 is dead code, which can be removed safely. Or, if you want to generate the random number between one to twenty-two replace the 17 by 22 in that statement.

Binding Events: Use addEventListener to bind events on elements. As in the current code, no event binding code is shown, if inline binding in HTML is used, use addEventListener` to bind events.

Context

StackExchange Code Review Q#139905, answer score: 3

Revisions (0)

No revisions yet.