JavaScript for BASIC Programmers: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
 
(21 intermediate revisions by the same user not shown)
Line 9: Line 9:
=== Variable Types ===
=== Variable Types ===


JavaScript variables are not explicitly typed: they get their types from whatever is assigned to them. It's very similar to BASIC's Variant type.
JavaScript variables are not explicitly typed: they get their types from whatever is assigned to them. It's very similar to BASIC's Variant type. Variable names are case sensitive: myVar is not the same as myvar.


Variables are declared with the VAR statement:
Variables are declared with the VAR statement:
Line 16: Line 16:
! BASIC !! JavaScript
! BASIC !! JavaScript
|-
|-
| Dim a || var a;<br>var b,c;<br>var d = 100;
|<syntaxhighlight lang="vbnet">
Dim a
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
var a;
var b,c;
var d = 100;
</syntaxhighlight>
|}
|}


In JavaScript, you can declare multiple variables in one statement. You can also assign an initial value.
In JavaScript, you can declare multiple variables in one statement. You can also assign an initial value.
==== Arrays ====
{| class="wikitable"
|-
! BASIC !! JavaScript
|-
|<syntaxhighlight lang="vbnet">
Dim a(100)
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
var a = [];
</syntaxhighlight>
|-
|<syntaxhighlight lang="vbnet">
a(1) = 1
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
a[1] = 1;
</syntaxhighlight>
|}
Arrays use square brackets, not round. No limit is declared on the size of the array. You can create an array simply by assigning an empty array to a variable.


=== Assignment ===
=== Assignment ===
Line 27: Line 56:
! BASIC !! JavaScript
! BASIC !! JavaScript
|-
|-
| a = 100 || a = 100;
|<syntaxhighlight lang="vbnet">
a = 100;
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
a = 100;
</syntaxhighlight>
|-
|-
| b = "Zaphod" || b = "Zaphod";<br>b = 'Zaphod';
|<syntaxhighlight lang="vbnet">
s = "Zaphod"
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
s = "Zaphod";
s = 'Zaphod';
</syntaxhighlight>
|}
|}


Line 42: Line 82:
! BASIC !! JavaScript
! BASIC !! JavaScript
|-
|-
|<syntaxhighlight lang="basic">
|<syntaxhighlight lang="vbnet">
If a = 1 Then b = 2
If a = 1 Then b = 2
</syntaxhighlight>||
</syntaxhighlight>||
Line 49: Line 89:
</syntaxhighlight>
</syntaxhighlight>
|-
|-
|<syntaxhighlight lang="basic">
|<syntaxhighlight lang="vbnet">
If a = 1 Then
If a = 1 Then
     b = 2
     b = 2
Line 60: Line 100:
</syntaxhighlight>
</syntaxhighlight>
|-
|-
|<syntaxhighlight lang="basic">
|<syntaxhighlight lang="vbnet">
If a = 1 Then
If a = 1 Then
     b = 2
     b = 2
Line 75: Line 115:
</syntaxhighlight>
</syntaxhighlight>
|}
|}
JavaScript uses curly braces to group the statements in the THEN and ELSE code. We'll see those curly braces used to group code in other places.
JavaScript uses different operators for assignment and to test equality. Assignment is a single =, while testing equality is ==.


=== Operators ===
=== Operators ===
Here is a list of BASIC operators and their JavaScript equivalents:
{| class="wikitable"
|-
! BASIC !! JavaScript !! Notes
|-
| = || = || Assignment
|-
| = || == || Are the two args equal?
|-
| <> || != || Are the two args unequal?
|-
| <, >, <=, >= || <, >, <=, >= || No difference
|-
| & || + || Concatenate two strings
|-
| Or || &#124;&#124; || Logical Or
|-
| And || && || Logical Or
|-
| Not || ! || Logical not
|}


=== For loops ===
=== For loops ===


{| class="wikitable"
|-
! BASIC !! JavaScript
|-
|<syntaxhighlight lang="vbnet">
For i = 1 to 10
    a(i) = i
Next
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
for (i=1; i<=10; i++){
    a[i] = i;
}
</syntaxhighlight>
|}
JavaScript has 3 parts to its for statement, separated by semicolons. The first is the start value, the second is the end value and the third is the increment. <code>i++</code> increments by 1.


=== Statement Endings ===
=== Statement Endings ===
{| class="wikitable"
|-
! BASIC !! JavaScript
|-
|<syntaxhighlight lang="vbnet">
a = "This is a very long " & _
"statement"
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
a = "This is a very long " +
    "statement";
</syntaxhighlight>
|-
|<syntaxhighlight lang="vbnet">
b = ("Yesterday", _
"Today", _
"Tomorrow" _
)
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
b = ["Yesterday",
    "Today",
    "Tomorrow"
];
</syntaxhighlight>
|}
=== Functions ===
{| class="wikitable"
|-
! BASIC !! JavaScript
|-
|<syntaxhighlight lang="vbnet">
Sub mySubroutine(x)
  Print "x"
End Sub"
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
function mySubroutine(x) {
  NSB.Print("x");
}
</syntaxhighlight>
|-
|<syntaxhighlight lang="vbnet">
Function myFunction(x)
  Print "x"
  myFunction = "done"
End Function"
</syntaxhighlight>||
<syntaxhighlight lang="javascript">
function myFunction(x) {
  NSB.Print("x");
  return "done";
}
myFunction = function(x) {
  NSB.Print("x");
  return "done";
}
</syntaxhighlight>
|}

Latest revision as of 14:22, 7 August 2017

AppStudio's BASIC is modelled on Microsoft's Visual BASIC. It runs on other operating system by translating the BASIC to JavaScript, a language which is supported on all platforms.

JavaScript is a powerful and flexible programming language. It's the standard programming language of the web. It's also the subject of Atwood's Law: "Any application that can be written in JavaScript, will eventually be written in JavaScript."

When we designed our Translator, we were pleased to discover that almost everything in BASIC had a direct equivalent in JavaScript. Each BASIC statement could be turned into a JavaScript statement which did the same thing. (The reverse is not true: there are many features in JavaScript which do not have an equivalent in BASIC.)

This document isn't intended to teach you everything about JavaScript. It should give you enough of an introduction to get started and learn the basic forms of JavaScript.

Variable Types

JavaScript variables are not explicitly typed: they get their types from whatever is assigned to them. It's very similar to BASIC's Variant type. Variable names are case sensitive: myVar is not the same as myvar.

Variables are declared with the VAR statement:

BASIC JavaScript
Dim a
var a;
var b,c;
var d = 100;

In JavaScript, you can declare multiple variables in one statement. You can also assign an initial value.

Arrays

BASIC JavaScript
Dim a(100)
var a = [];
a(1) = 1
a[1] = 1;

Arrays use square brackets, not round. No limit is declared on the size of the array. You can create an array simply by assigning an empty array to a variable.

Assignment

BASIC JavaScript
a = 100;
a = 100;
s = "Zaphod"
s = "Zaphod";
s = 'Zaphod';

There is no real difference between the languages. Note that JavaScript statements end with a semicolon (";"), rather than the end of the line. You are therefore allowed to break up statements into multiple lines.

Strings can be surrounded by matched single or double quotes. This make is much easier to have embedded quotes in strings.

IF statements

BASIC JavaScript
If a = 1 Then b = 2
if (a == 1) b = 2;
If a = 1 Then
     b = 2
 End If
if (a == 1) {
    b = 2;
}
If a = 1 Then
    b = 2
Else
   c = 3
End If
if (a == 1) {
    b = 2;
} else {
    c = 3;
}

JavaScript uses curly braces to group the statements in the THEN and ELSE code. We'll see those curly braces used to group code in other places.

JavaScript uses different operators for assignment and to test equality. Assignment is a single =, while testing equality is ==.

Operators

Here is a list of BASIC operators and their JavaScript equivalents:

BASIC JavaScript Notes
= = Assignment
= == Are the two args equal?
<> != Are the two args unequal?
<, >, <=, >= <, >, <=, >= No difference
& + Concatenate two strings
Or || Logical Or
And && Logical Or
Not ! Logical not

For loops

BASIC JavaScript
For i = 1 to 10
    a(i) = i
Next
for (i=1; i<=10; i++){
    a[i] = i;
}

JavaScript has 3 parts to its for statement, separated by semicolons. The first is the start value, the second is the end value and the third is the increment. i++ increments by 1.

Statement Endings

BASIC JavaScript
a = "This is a very long " & _
"statement"
a = "This is a very long " +
    "statement";
b = ("Yesterday", _
"Today", _
"Tomorrow" _
)
b = ["Yesterday", 
     "Today", 
     "Tomorrow" 
];


Functions

BASIC JavaScript
Sub mySubroutine(x)
  Print "x"
End Sub"
function mySubroutine(x) {
  NSB.Print("x");
}
Function myFunction(x)
  Print "x"
  myFunction = "done"
End Function"
function myFunction(x) {
  NSB.Print("x");
  return "done";
}

myFunction = function(x) {
  NSB.Print("x");
  return "done";
}