みんなさんお久しぶりです。最近社内でどある案件で無線を使ってSiemensのCPUをアクセスしWEB SERVERが開けるように命じられました。SiemensのCPUは標準のWEB SERVERもあり、自分でCODINGし画面を作ることもできます。そういうときは使われてるプログラム言語はHTML、CSS、Javascriptです。あとPYTHONも使える可能性もあるかもれませんのでPYTHONのメモもしますのでもし興味あればぜひみてください。
Hello World!
まずはHello WorldをPrintしましょう。
.html、.css、.js3つのFILEを同じのFOLDERで作りましょう。
<head> </head> <script type="text/javascript" src="script.js"></script> <body> </body>
.html に以上のCODEを追加しましょう。
console.log("hello world");
.jsに以上のCODEを追加しましょう。
次はいつも使ってるのBROWERで.htmlを開いてみましょう。
Command+ALT＋Iで開発ツールを開いて、Consoleをみると、
Hello worldがPrintされました！おめでとう！始めてのJavascriptプログラムが成功しました！
計算をしてみよう
console.log(4+5); console.log(5-1); console.log(2*3); console.log(20/5);
今回は簡単な計算を行ってみます。
うん、見事に結果返してくれましたね。
変数と定数を作ってみよう
let variables1=10; const PI=3.14; console.log(variables1); console.log(PI); variables1=12; console.log(variables1); PI=5.0;//Get Error
letというKEYWORDを使って変数variables1を定義し10を入れます。
constというKEYWORDを使って定数PIを定義し3.14を設定します。
variables1は変数なので別の数字を入れ替えるのは問題ないですが、定数を変更するとエラーが出てきます。
ここは結果です。
Stringの簡単処理
let Tag1='Pump';
console.log('The name of tag1 is '+Tag1);
＋といOperatorを使えば2つのStringをつながることもできます。
これは結果です。
でもJavascript(ES6)ではもっと簡単な方法があります。これは${your variables}です。
let Tag1='Pump';
console.log(`The name of tag1 is '${Tag1}`);
結果は同じです。
Function
Functionはレシビみたいにデータを入れて、計算、条件判断などし最後は結果を戻すのです。それを使うことによってプログラムする際に同じなCODEを何回もCOPYしなくても平気です。
function printHelloWorld(){
console.log("HELLOW WORLD!");
}
printHelloWorld();
これは凄く簡単なFUNCTIONで呼びされる度にHELLOW WORLD!をPRINT OUTするだけです。
結果です。
alert
function printHelloWorld(){
alert("HELLOW WORLD!");
}
printHelloWorld();
POPUP WINDOWが出ます。
結果です。
Parameters
ではもしFUNCTIONになにが数値を渡したいときはどうすればいいですか？
function getAreaRect(w,h){
console.log('the area is '+w*h);
}
getAreaRect(2,3);
このFUNCTIONはWとH、2つのParametersを受けて、w掛けるhの結果をPRINT OUTします。
結果はこれですが、毎回も違う数値を入れるとFunctionが計算されて結果を出すことになります。つまり何回もCOPYするという無駄な作業はしなくても平気です。
Return
console.log()でもちろん実行結果もらえますが、ReturnといKEYWORDを使えば結果はFUNCTIONの”中から”外に出ることができます。
function getAreaRect(w,h){
return('the area is '+w*h);
}
var result;
result=getAreaRect(4,5);
今度は変数resultが”the area is 20″が入ってます。
Global ScopeとBlock Scope
つまり、Global変数とLocal変数ってことですね。文字で説明するよりCODEをみるのほうが早です。
const Voltage=220;
function function1(){
console.log(Voltage);
}
function1();
ここで結果は220になります。では、Block Scopeは？
function function2(){
var current;
current=50.0;
console.log(current);
}
console.log(current);
今度はERRORが出てきますーVM1571:1 Uncaught ReferenceError: current is not defined
at <anonymous>:1:13
つまりcurrentという変数はFunction内の変数なので、Functionから出るともう消えます。アクセスすることができません。
では今回はここで終わりしましょう。もう眠いので…
また今度ね！