Opera の attachEvent は addEventListener のエイリアスだと思う

JavaScript DOM JScript


think49
Opera の attachEvent は addEventListener のエイリアスっぽいなあ。実行順が保証される上に { handleEvent: ... } まで通る。
3月26日 1:37 AM
think49
event.target === event.srcElement, event.currentTarget === this が両方とも true になる。
3月26日 1:38 AM
think49
event.preventDefault があり、'returnValue' in event === false
3月26日 1:41 AM
think49
event.stopPropagation があり、'cancelBubble' in event === true
3月26日 1:44 AM
think49
Opera 11.01 の実装は addEventListener に近い。
IE の attachEvent 用に書いたコードがそのまま通る可能性はそれほど高くないと思う…。
3月26日 1:46 AM

var でDontDelete属性が付与されるのは ES3 まで

ECMAScript JavaScript


think49
JavaScript Coding Guidelines for Mac OS X: メモリとパフォーマンスの検討事項
3月22日 1:34 PM
think49
@ そもそも、VariableStatement はDontDelete属性を付与するから delete できないはず…と思ったが、それは までの仕様らしい。
3月22日 1:55 PM
think49
@ ではDontDelete属性が存在しない。従って、VariableStatement で宣言した変数も削除できる。
.2
3月22日 1:57 PM
think49
@ ということは、クロージャによる上位スコープの変数参照も delete で解放できそうだ。重宝しそうなので、覚えておこう…。
3月22日 2:01 PM

compatible-event.js 制作記録

HTML5 DOM JavaScript JScript


think49
イベントリスナについて教えてください - Yahoo!知恵袋
/
attachEvent で実行順を保証したいらしいが、これは難問。handleEvent をキャッシュする必要があると思う…。
3月23日 5:43 PM
think49
@ まだ作成中だけど gist にポストした。attachEvent の実行順は保証されてなくて循環参照対策は実装済み。
3月23日 6:17 PM
think49
@ 7割ぐらい完成したので version 0.7.0 にした。
3月23日 10:46 PM
think49
@ attachEvent における実行順の保証は完成。
あとは JScriptEvent の挙動を DOM Events の仕様に合わせよう。event.preventDefault とか {handleEvent: fn} とか。
3月23日 10:50 PM
think49
textareaSelectEndPoint.js が Firefox, Google Chrome で動かないと報告を頂いたけど、どのよう修正すればいいのかわからないでいる…。
3月25日 12:02 AM
rikuba
@ 21行目と120行目、arguments[0]を渡すのを忘れているのでは。
3月24日 2:07 AM
think49
@ ご指摘ありがとうございます。すっかり忘れてました…。修正しておきます。
3月24日 2:13 AM
think49
@ arguments[0] の不具合修正及び、{handleEvent: fn} に対応。コメント欄に解説を加えた。
3月24日 9:45 PM
think49
@ DOM Events の一部を実装した。(@ 0.9.1b) /
event.target, event.currentTarget, event.preventDefault, event.stopPropagation に対応している。
3月25日 2:54 PM
think49
ただし、event.srcElement === null になる不具合への対策(event.target への適切なノード初期化)はまだ甘い。
3月25日 2:58 PM
think49
window-load ,window-unload, document-DOMContentLoaded 時に event.target === document にする実装にしたが、まだ対応すべきイベントタイプがあると思われる。
3月25日 2:58 PM

"use strict"; はグローバルコードに書いても良い

ECMAScript JavaScript

JSLint ではグローバルコードに 'use strict'; を書くとエラーになるが、ECMAScript 5 違反ではないらしい。(おそらく、Crockford氏の独自の思想によるエラーだと思う)


think49
'use strict'; はグローバルコードに書いてはいけないんだったかな。JSLint で怒られる…。
3月23日 5:45 PM
think49
"- Global code is strict global code if it begins with a Directive Prologue that contains a Use Strict ..."
3月23日 5:53 PM
think49
@ グローバルコードで 'use strict'; して問題ないことを確認した。勿論、"use strict"; でも良い。
.1
3月23日 5:56 PM
think49
(function () { 'use strict'; })(); // JSLint は "Move the invocation into the parens that contain the function." のエラーを出力する。なぜ…？
3月23日 6:02 PM

XML宣言 (XMLDecl) は処理命令 (PI) ではない

XML DOM

XML宣言が PROCESSING_INSTRUCTION_NODE だと思っていて、以下のXHTML文書を書いていました。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
  <!--
    /**
     * サーバは次のHTTPヘッダを出力しています。
     * Content-Type: application/xhtml+xml; charset=UTF-8
     */
  -->
  <title>XHTML5</title>
</head>
<body>
  <script type="application/javascript"><![CDATA[
  console.log(document.firstChild.nodeType === Node.DOCUMENT_TYPE_NODE);                                                                    // true
  console.log(document.evaluate('child::processing-instruction()', document, null, 7, null).snapshotLength);                                // 0
  console.log(document.createProcessingInstruction('xml', 'version="1.0" encoding="UTF-8"').nodeType === Node.PROCESSING_INSTRUCTION_NODE); // true
  ]]></script>
</body>
</html>

しかし、XML宣言は PROCESSING_INSTRUCTION_NODE ではないので document からノードとして認識されません。
XML宣言の情報は Interface Document (DOM L3 Core) のプロパティとして定義されています。

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
  <title>XHTML5</title>
</head>
<body>
  <script type="application/javascript"><![CDATA[
  console.log(document.xmlVersion);    // "1.0"
  console.log(document.xmlEncoding);   // "UTF-8"
  console.log(document.xmlStandalone); // true
  ]]></script>
</body>
</html>


think49
いい方法が見つからないなあ。/ JavaScriptでのXML解析について質問です。 JavaScriptでXMLファイルを読み込んで... - Yahoo!知恵袋
3月5日 6:18 PM
think49
XPath で PROCESSING_INSTRUCTION_NODE を得られると思ったら snapshotLength が 0 になってしまった。XPath式が間違ってるのかな。
3月5日 6:32 PM
think49
document.firstChild が PROCESSING_INSTRUCTION_NODE ではなく、DOCUMENT_TYPE_NODE になる。
3月5日 6:33 PM
think49
document.createProcessingInstruction('xml', 'version="1.0" encoding="UTF-8"'); は使えるので、PROCESSING_INSTRUCTION_NODE を認識しないわけではなさそう。
3月5日 6:36 PM
TOYAMA Nao
@ XML宣言は処理命令ではないです。
3月5日 6:54 PM
think49
@ ありがとうございます。2.6 Processing Instructions も合わせて読んで理解できました。
3月5日 9:51 PM
think49
" 'XML'や'xml'などの対象名は、この仕様書のこのバージョン及び将来のバージョンにおける標準化の為に予約されている。処理命令対象の正式な宣言の為に、XML記法機構が使われる事もある。"
3月5日 9:53 PM
think49
XMLDecl の <?xml version="1.0"?> と PI の <?xml version="1.0"?> は別物。
ただし、PITarget の "XML", "xml" は予約されており、将来のバージョンで使われる可能性がある。
3月5日 9:58 PM
think49
PITarget に "xml" は「使うべきではない」(SHOULD NOT) または「使ってはならない」(MUST NOT) と読んだ方がいいのだろう…。
3月5日 10:00 PM

String(value) と value += ''; の違い


think49
読んでる。/ Togetter - 「JavaScript の算術演算子と数値変換」
2月24日 2:55 PM
think49
@ arg = +arg; で ToNumber が呼び出されるというお話。これは Number() と同じ効果がある。
2月24日 2:57 PM
think49
@ ! は ToBoolean 演算子を呼び出して結果を反転する。従って、!! で Boolean() と同じ結果となる。
2月24日 2:58 PM
think49
@ arg += ''; は arg のプリミティブ値に ToString 演算子を適用する。これは String() と結果が異なる。
( の nanto_vi さんのコメントが参考になる)
2月24日 3:01 PM
think49
@ はいー。型変換について調査していたら引っかかりました。
2月24日 3:02 PM
think49
@ それでもこの手法がよくとられるのはプリミティブ値と toString値 (と便宜上置いておく)の値が同値の場合に使われるからだと思う。
2月24日 3:04 PM
think49
@ Number型の値の場合はそれで問題なかった。数値演算はプリミティブ値を元に行われるので必ず同値となる。
2月24日 3:05 PM
think49
@ 実際はないけれども、Object.prototype.toNumber なんてメソッドが定義されていたら同じ問題が出てきたと思う。
2月24日 3:08 PM
think49
@ 実証コードを書いてみた。
2月24日 3:32 PM
think49
"valueOf メソッドはその this 値を返す。"
(ES3: 15.2.4.4 Object.prototype.valueOf)
2月24日 4:01 PM
think49
@ console.log(({}).valueOf() + ''); は console.log(({}).valueOf().toString() + ''); になるから問題ないんだなー。
2月24日 4:03 PM

条件付きコメントと条件付きコンパイルの違い


think49
jQuery で条件付きコメントを応用して、MSIE のバージョンを得る方法が書かれたコードがどこかにあったと思うけど忘れてしまった…。github にコードが上がっていて何かのブログ記事で見た覚えがある。
2月24日 6:21 PM
think49
@ こんな感じだったはず。
あのブログ記事はどこだったかなー。jQuery を解読した海外のブログを翻訳したまとめだった気がする。
2月24日 6:25 PM
edvakf
@ ですね
2月24日 6:25 PM
azu
@ これの5番目くらいのやつ
2月24日 6:25 PM
think49
MSIE で実装別に処理を分ける方法に「条件付きコメント」と「条件付きコンパイル」があるけど、この2つは別物なんだなあ。
前者を "UA Detection" とするなら、後者は "ScriptEngine Detection" というべきか。
2月24日 6:36 PM
think49
@ IE6 (WindowsXP SP2) は @ === 5.6 だが、IE6 (WindowsXP SP3) は @ === 5.7
2月24日 6:40 PM
think49
@ IE6 を判定する場合、IE6 (jscript_version == 5.6 or 5.7) を判定したいのか、IE6 (jscript_version == 5.6) を判定したいのか、予め調査する必要があるが、正直面倒な気がする。
2月24日 6:47 PM
think49
@ 「JScriptエンジンのバージョンに依存する問題」なのか、「IEのバージョンに依存する問題」なのか判断するためには IE6 (Windows XP SP2) と IE6 (Windows XP SP3) の両方を検証する必要があるが、どう考えても手間がかかる。
2月24日 6:51 PM
think49
@ そんなところに手間をかけるぐらいなら、"Feature Detection" にした方が能率が上がっていいんじゃないかなー。
2月24日 6:54 PM
think49
回答した。/
IE6だけの判定、IE7だけの判定について | OKWave
2月24日 7:13 PM

(2012/04/15 13:21追記)
条件付きコメントは IE10 から廃止される予定です。