JavaScript」タグアーカイブ

JavaScript prototype: static method

JavaScript Tips を更新しました。
JavaScript Tips – Paepoi

古くさいコードを書き直しだけならすぐ終わるんだけど。
無意味に class のコードを prototype で書いてみたりとか。

// ベースクラスのようなもの、ES5 表記なのは意図的です
var TestClassBase = function(num) {
    this._num = num;
}
TestClassBase.staticFunc = function() {
    console.log('staticFunc 呼び出し');
}
TestClassBase.prototype.instanceFunc = function() {
    console.log('num は '+ this._num + ' です');
}
 
// 継承のようなもの
var TestClass = function(num) {
    TestClassBase.call(this, num);
}
TestClass.prototype = Object.create(TestClassBase.prototype);
TestClass.prototype.constructor = TestClass;
// 静的メソッドは無理やり継承
for (var p in TestClassBase) {
    if (TestClass[p] === undefined) {
        TestClass[p] = TestClassBase[p];
    }
}
// 新たな定義
TestClass.prototype.getNum = function() {
    return '百倍すると ' + this._num * 100 + ' です';
}
  
// 直接定義したものはそのまま呼び出す
TestClass.staticFunc();
  
// prototype で定義したものは object 化してから呼び出す
var test = new TestClass(7);
test.instanceFunc();
//tc.staticFunc(); // インスタンス化すると静的関数は呼び出しできない
  
console.log(test.getNum());

こんなの。

MDN で見つけたコードでは静的メソッドが継承できなくて。
ネットを探しても「できません」としか見つからなくて。
実現させろよ、プログラミングってそういうものだろみたいな。

意地になって色々試してやっと実現、安全は保証しないけど。
別にいいよね、今は普通に class を使うはずだもんね。
わざわざ ES5 縛りでやった意味は別に無い、楽しかったわ。

Gjs setInterval

先日 Gjs で TextDecoder が使えると書きましたが。

for (let s in this) print(s);

this

グローバル関数だったんですね、無理やりな実装だなって。
てか setTimeout や setInterval も追加されているじゃないの。
console.log も使えるようになったし、Web に合わせてきたのね。
Web や Node.js と同じなのかな、チト試してみよう。

#!/usr/bin/gjs -m

import GLib from 'gi://GLib';

const mainloop = new GLib.MainLoop(null, false);

let count = 1;
let id = setInterval(()=> {
    if (count == 5) {
        clearInterval(id);
        mainloop.quit();
    }
    console.log(count);
    count++;
}, 1000);

print('__do__');

mainloop.run();

print('__done__');

log

基本 Web と同じですけど、やっぱりメインループが必要ですね。
Web の場合はブラウザがメインループを回しているから不要なだけで。
Node.js が不要だからややこしい、繰り返し処理にはループが必要。
GtkApplication から使う等の場合は当然別途のループはいりません。

console.log は print と同じでいいのに、スタンドアロンでこの表示いる?
とにかく Web 標準と同様に使えます、ということで。

というか、Gjs って三年前とは全然変わってしまったなと。
tips ページはそろそろ丸ごと書き換えしなきゃ、面倒くさいなぁ。。。。。

Javascript TextDecoder

知らぬ間に Gjs の挙動が変わっていた。
普段は Python ばかりなのでいつからかは解らない。

#!/usr/bin/gjs -m

import GLib from 'gi://GLib';

/**
 * res is Uint8Array
 */
let res =  GLib.spawn_command_line_sync('pwd')[1];
print(res.toString()); //=> Warning

warn

よく見ると実行はされているので警告されているだけですね。
今まで普通に動いた、なんなら toString さえ暗黙実行されていた。

Google translate 等を使えば解るけど TextDecoder 使えってさ。
互換性のために残しているけどはよ移行しろということらしい。
警告メッセージも親切になったもんだ、ということで。

TextDecoder – Web API | MDN

主要ブラウザは全部が既に実装済みなんですね。
Web API なんだが Gjs や JXA でも使えるのだろうか?

#!/usr/bin/gjs -m

import GLib from 'gi://GLib';

let res =  GLib.spawn_command_line_sync('pwd')[1];
// TextDecoder
let dec = new TextDecoder();
let text = dec.decode(res);
print(text.trim());

動くじゃん、Spider Monkey 自体に実装されているのだろうか。
import 何も無しで使えるのって筆者は正直気持ち悪いんですけど。
string に変換されたので trim メソッドで改行を削除しています。
ちなみに。

#!/usr/bin/gjs

/**
 * old gjs
 */

const GLib = imports.gi.GLib;
const ByteArray = imports.byteArray;

let res =  GLib.spawn_command_line_sync('pwd')[1];
let text = ByteArray.toString(res);
print(text.trim());

byteArray モジュールを使う以前の正規な手段もまだ使えます。
というか、imports でのインポートもまだ普通に使えるんだよね。
byteArray も imports も Gjs 独自実装だから排除したかったのだろうけど。
Gjs で新しい手段の import では -m オプションを忘れずに。

jxa

JXA では TextDecoder 等は使えない、やはり実装はバラバラ。
というか JXA の UTF8String って正体は string じゃないか。
普通に string のメソッドが使えるし、まあ Cocoa がそうなのね。
Uint8Array は JXA ではほぼ扱われることが無いということだろう。
Node.js やその他は知らないしどうでもいい。

非推奨の機能、廃止された機能 – JavaScript | MDN

てか escape や unescape は非推奨になっていたのか。
Tips ページをいくつか書き換えなきゃなぁ面倒だなぁ。
え?今日は公園には行きましたよ、察して。

Bookmarklet

ブログに他サイトのリンクを貼る用のブックマークレット。
長年どこかのサイトで見つけた以下の奴をずっと使っていた。

javascript:var url=location.href;var title=document.title;var link ='<a href="'+url+'" target="_blank">'+title+'</a>';var x = prompt('',link);

これ骨董品の ES5 ではないですか。
2023 年な現在でも問題なく動くけれど、流石に書き換えたいぞ。

それと、この手段では一度プロンプトを出すと二度目が出せないのがたまに困る。
今までページの読み直しで対処していたけどせっかくなのでソレもなんとかしたい。
ということで色々探してみる。

【必見】ブックマークレットの使い方・作り方と便利なおすすめ13選を解説 – WEBCAMP MEDIA

そうか、即時関数にしてしまえばいいんだ!
ということでこう書き換えてみました。

javascript:(()=> {prompt('',`<a href="${location.href}" target="_blank">${document.title}</a>`);})();

テンプレートリテラルなら普通に一行で終わるんだよね。
同一ページで何度でも出せるようになったし、狙いどおり。
まあ、使い勝手は何も変わらないんですけど。

ところで、上記リンク先なように replace で URL を書き換えるのって使えそう。
localhost で編集した自サイトをアップロードしてお知らせをブログでって時。
今まで手書きで URL を書き換えしていたけれど、たまに忘れて再編集とかやったけど。

javascript:(()=> {prompt('',`<a href="${location.href.replace('http://localhost', 'https://palepoli.skr.jp')}">${document.title}</a>`);})();

そんなことまで自動化できるじゃん。
プログラミングとは定形作業の自動化が主体ですからね。

JavaScript Object for-in

つい最近知ったのですが。
JavaScript のオブジェクトで for-in は順序固定になっていた。

#!/usr/bin/gjs

let text = 'あいうえおかきくけこ';
let ls = {};

for (let s of text) ls[s] = s+s+s;

for (let key in ls) print(`Key=${key} Value=${ls[key]}`);

gjs

マジだ、ES2020 かららしい。

これができないのが主な理由で ES6(ES2015) で Map が追加された。
Map なんて誰も使わなかったということなのだろうか。

JavaScript その他 – Paepoi
書き換えしなきゃなぁ、どんどん情報が古くなる。

そういえば Python の連想配列も 3.7 から順序固定になっていたんだっけ。
collections.OrderedDict は存在すら知らない人も多いし。

#!/usr/bin/env python3

text = 'あいうえおかきくけこ'
ls = {}

for s in text: ls[s] = s+s+s

for key in ls: print(f'Key={key} Value={ls[key]}')

まったく同じですね、流行なのかな。
まてよ、もしかして GLib なんかも。

#include <glib.h>
#include <glib/gprintf.h>

void
printfunc(gpointer key, gpointer value, gpointer user_data) {
    g_printf("key=%s value=%s\n", key, value);
}

int
main (int argc, char *argv[]) {

    GHashTable *table;

    table = g_hash_table_new(g_str_hash, g_str_equal);
    g_hash_table_insert(table, "あ", "あああ");
    g_hash_table_insert(table, "い", "いいい");
    g_hash_table_insert(table, "う", "ううう");
    g_hash_table_insert(table, "え", "えええ");
    g_hash_table_insert(table, "お", "おおお");
    g_hash_table_insert(table, "こ", "こここ");
    g_hash_table_insert(table, "け", "けけけ");
    g_hash_table_insert(table, "く", "くくく");
    g_hash_table_insert(table, "き", "ききき");
    g_hash_table_insert(table, "か", "かかか");
    //
    g_hash_table_foreach(table, printfunc, NULL);
    return 0;
}

glib

やっぱり駄目でした、普通はこうなるし。
C を久々に書いてみたけどメンドクセー!