This page (revision-1) was last changed on 20-Apr-2024 11:53 by Hiroaki Tateshita

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Page revision history

Version Date Modified Size Author Changes ... Change note
20-Apr-2024 11:53 2 KB Hiroaki Tateshita

Page References

Incoming links Outgoing links
Java Script
JavaScript

Version management

Difference between version and

At line 1 added 43 lines
[{PageViewPlugin}]
[Cytoscape], [OpenLayers], [Kibo Viewer|KiboFinder]
!!!Abstract
JavaScriptについての備忘録。比較的最近よく使う[プログラミング言語|Programming Language]です。callbackな感覚を身につけないと、なかなかしっくりこない。精進します。ちなみに[Java]とは、全然違います。
!!!Topics
*[Minecraft Programming]
|興味あります。いろいろアプローチがありそうですが、私はCode Connectionというツールを使うと、Makecodeという選択肢があり、そこを選ぶとJavaScriptをグラフィカルに作れる環境がでてきます。いろいろ調べたいと思います。
*数字をインプットするテキストボックス
|[8]を参考にしました。
{{{
<input type="number" name="sample" id="sample1"/>
<input type="tel" name="sample" id="sample2"/>
}}}
*配列
|Javascriptでは配列を私はよく使います。配列に結構機能がついていて、最初は慣れないけど、なれると結構便利です。foreachとかsomeとかこのあたりは反復メソッドと呼ぶようですが[6]、このメソッドの引数は関数Functionです。なのでよくこんな形になります。
{{{
an_array.foreach(function(element, index, array){
***;
return;
});
}}}
|functionの引数のelementはan_arrayのindex番目の要素です。なので、element と　{{{array[index]}}}は同じはず。。。でもarrayって使ったことない。
*配列への追加・削除
|追加するときはpush()をすると末尾に追加されます。pop()すると末尾が削除されます。インデックスを指定して直接の代入はできませんでした。
*関数の引数の値の変更
|関数の引数にある変数をいれて、関数内でその値を変更したい場合、引き渡し方によっては、関数の中でしかアップデートできず、意図と違う動きをする。参照元を渡すのか、値だけをコピーして渡すのかの違いと理解[7]。説明方法としてあっているのかな。。。
*開発時のCross domain問題回避
|どうもローカルでの開発には限界があるっぽい[1]。ローカルでHTTPサーバを動かしてつくるのが早いような。VS CODEでできないかな。LiveServer[3]という[Visual Studio Code]のプラグインを使ってみる。
*[OpenLayers]
|[OSM Plugin]にも使っているこのOpenLayers。すばらしいJavaScriptライブラリです。
*Import
|[OpenLayers]のIconのサンプル[4]を見るとimportが使われている。importを使うには、type="module"を指定する[2]をあるが、HTMLからJavaScriptを呼び出すときにその指定をやるのかな。Script タブのTypeをModuleにしてみたら、動かなくなった。ここ[5]に従い、olパッケージのインストールをしてみたが、だめだった。type="text/javascript"に戻すことにしたが、いつか使えるようにしたい。
!!!Referece
#[#1]Misaki0714, 2017/08/28 , ローカル環境でのHTMLインクルード方法, [https://teratail.com/questions/90124]
#[#2]Mozilla Contributors , 2018/08/29, Import, [https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/import]
#[#3] Ritwick Dey ,2018年11月28日, Live Server, [https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer]
#[#4] OpenLayers Contributors, Icon Symbolizer, [https://openlayers.org/en/latest/examples/icon.html]
#[#5] OpenLayers Contributors, OpenLayers Introduction, [http://openlayers.org/en/latest/doc/tutorials/bundle.html]
#[#6] Mozilla Contributors, 2018/12/24, Array, [https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array]
#[#7] @makotoo2, 2016年09月24日, 引数の渡し方を理解しよう, [https://qiita.com/makotoo2/items/50c6ee98c18f35688b17]
#[#8][@Avocado|https://qiita.com/Avocado] 2018年09月08日に更新, 数字のみを入力できるフォーム(テキストボックス)を作成する, [https://qiita.com/Avocado/items/2148d3af400823f91ea5]
This page (revision-) was last changed on 20-Apr-2024 11:53 by Hiroaki TateshitaTop