TOP カテ一覧 スレ一覧 100〜終まで 2ch元 削除依頼
■ページランク(GooglePageRank)について Part5■
あなたのサイト制作ソフト一覧 part 2
サイト運営で嬉しい事があった管理人の憩いの場。2
(´-`).。oO人はTABLEにもどってくるんだよ。
Web業界脱出(他業種転職)専用スレ
掲示板へのカキコ向上スレ【常連獲得】
厨房サイトがザクザク出てくる検索用語〜Part2〜
+ JavaScript の質問用スレッド vol.141 +
.htaccess質問コーナー Part8
SOHOやフリーで本当に細々と食ってる奴の121人目

+ JavaScript の質問用スレッド vol.135 +


1 :2018/07/31 〜 最終レス :2018/09/11
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください

■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。

■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)

■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
 1レスに収まらないならコード投稿サイトを利用してください。
 http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/

■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける=荒らしです

2 :
■FAQ

◆開発者ツール(Developer Tools)の基本的な使い方
 ▼諸注意
  - 本説明では Google Chrome の開発者ツールの名称に従います。他ブラウザで使う場合は適宜読み替えて下さい。
  - Edge- でコンソールを使うには予め開発者ツールを起動しておく必要があります(開発者ツールを起動しないと console.log() が機能しません)
  - Safari はデフォルトで開発者ツールが無効な為、有効に設定する必要があります。
  https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html
 ▼要素を検証
 1. ページ上で右クリックして [要素を検証]
 2. [Elements] パネルが開き、対象のDOMノードが選択される(選択対象が目的の要素でなければ [Elements] パネル上で選択し直す)
 3. 右側のサイドバーから知りたいステータス名のタブを選択する
   - [Styles] タブ … CSSプロパティの指定値を表示 (※カスケードによって上書きされたプロパティは取り消し線で表示される)
   - [Computed] タブ … CSSプロパティの算出値を表示("font-size: 1em" を指定していても算出後の "*px" で表示される)
   - [Properties] タブ … 選択したDOMノードのプロパティを表示
 ▼コンソール
 1. JavaScript コード上で console.log('Hello, World!'); と入力
 2. [Ctrl] + [Shift] + [I] キー(IE は [F12])で開発者ツールを開き、[Console] パネルを開く
 3. [Console] パネルに "Hello, World!" と表示される
 (※window.alert() は String 型に変換されますが、console.log() は Object 型の中身をそのまま表示してくれます。)

3 :
■FAQ(続き)
◆JavaScriptの実行速度
JavaScriptの速度は「ブラウザ名」「ブラウザのバージョン」「PCスペック」に依存します(ブラウザのバージョン毎に最適化具合が異なります)。
速度の疑問解消の為に http://jsperf.com/ (githubのアカウントが必要です)にコードをUPしてブラウザ毎に速度計測する事を推奨します。

例外として、仕様における理論上の速度が明確になっている場合があります。
例えば、正規表現によるマッチング処理を考えた場合、「RegExp#test > RegExp#exec > String#match」は ES5 仕様で保証(要出典)されています。
ES5 仕様において RegExp#test が最も処理数が少なく、String#match が最も処理数が多いことが明確だからです。
ブラウザによっては RegExp#test の最適化が十分でなく、String#match の最適化が RegExp#test より十分であれば逆転する可能性はありますが、各メソッドの最適化が一律であればこの前提が崩れる事はありません。

■各種仕様
◆ Standard ECMA-262
http://bclary.com/2004/11/07/ (ECMAScript 3 HTML版)
http://www2u.biglobe.ne.jp/~oz-07ams/2002/ecma262r3/ (ECMAScript 3 和訳)
http://www.ecma-international.org/ecma-262/5.1/ (ECMAScript 5.1 HTML版)
http://tsofthome.appspot.com/ecmascript.html (ECMAScript 5.1 和訳)
http://www.ecma-international.org/ecma-262/6.0/ (ECMAScript 6 / ECMAScript 2015)
http://kangax.github.io/compat-table/es5/ (ECMAScript 5 compatibility table)
http://kangax.github.io/compat-table/es6/ (ECMAScript 6 compatibility table)
◆ HTML Standard (HTML5)
http://www.whatwg.org/specs/web-apps/current-work/multipage/
http://momdo.s35.xrea.com/web-html-test/spec/WD-html51-20130528/Overview.html (HTML5.1 部分訳)
http://www.hcn.zaq.ne.jp/___/WEB/WebStorage-ja.html (Web Storage 和訳)

4 :
■各種仕様 (続き)
◆ Document Object Model (DOM) / CSS Object Model (CSSOM)
http://www.hcn.zaq.ne.jp/___/WEB/DOM4-ja.html (DOM Standard (DOM4) 和訳)
http://www.w3.org/TR/DOM-Level-3-Events/ (DOM3 Events)
http://www.w3.org/TR/uievents/ (UI Events)
http://www.hcn.zaq.ne.jp/___/WEB/cssom-ja.html (CSSOM 和訳)
http://www.hcn.zaq.ne.jp/___/WEB/cssom-view-ja.html (CSSOM View Module 和訳)
◆ その他のWeb関連仕様
http://domparsing.spec.whatwg.org/ (DOM Parsing and Serialization - innerHTML等)
http://www.hcn.zaq.ne.jp/___/WEB/XHR-ja.html (XMLHttpRequest 和訳)
http://www.hcn.zaq.ne.jp/___/WEB/File_API-ja.html (File API 和訳)
http://www.whatwg.org/specs/ (WHATWGの仕様一覧)
◆ MDN (Netscape/Mozilla)
https://developer.mozilla.org/ja/docs
◆ MSDN Library
https://msdn.microsoft.com/en-us/library/ie/hh828809 (Internet Explorer API)
http://msdn.microsoft.com/ja-jp/library/yek4tbz0.aspx (JavaScript)
http://msdn.microsoft.com/ja-jp/library/cc427807.aspx (JScript)
http://msdn.microsoft.com/ja-jp/library/cc409712.aspx (DHTML)
◆ JavaScript Garden (ja)
http://bonsaiden.github.com/JavaScript-Garden/ja/
◆ JSON (JavaScript Object Notation)
http://www.json.org/json-ja.html

5 :
■テンプレ案
http://fiddle.jshell.net/fH4cC/180/show/light/

■FAQ
http://fiddle.jshell.net/vSqKr/44/show/light/

■前スレ
JavaScript の質問用スレッド vol.134
http://mevius.2ch.sc/test/read.cgi/hp/1528096978/

6 :
>>1おつ

7 :
前スレの977の方ありがとうございました。
仕様上できないのですね。
残念です。

8 :
装飾はいくらでもできるけどここはJavaScriptスレだからスレチ

9 :
前スレの、>978

<div id="div-a">
<input type="text" id="text-a" value="あいう">
<input type="text" id="text-b" value="abc">
</div>

var input_elems = $.map( $('#div-a > input'),
function(elem, index) {
return $(elem).attrAll(); // this === element
}
);

Cookies.set( 'input', input_elems ); // 設定

obj = Cookies.getJSON('input'); // 取得
console.log( obj );

結果
id: "text-a", type: "text", value: "あいう"
id: "text-b", type: "text", value: "abc"

Cookie のライブラリは以下を使っています。
js-cookie/js-cookie
https://github.com/js-cookie/js-cookie

$.fn.attrAll は、以下のブログで定義されています。
要素の属性を全部取得する
https://hokaccha.hatenablog.com/entry/20130819/1376895914

10 :
特定の <div> のなかの <input> の状態を全部sessionStrageに保存して
あとでそれを再セットするって input の数や種類に依存せずにかけませんか?
div にも input にもユニークな id が振られてます
input.type は今の所 text select と checkbox だけです

native js でも jQuery でもいいです

11 :
>>9
前スレの>>978じゃないけど、
要素の属性取るならそんなプラグイン使わないで

jQuery標準の $.serialize か $.serializeArray を使えば良いんだよ
<form>要素以下になくても使える
今回の場合はserializeArrayの方が使い勝手良いかな?

https://api.jquery.com/serialize/
https://api.jquery.com/serializeArray/

で、実はそんなのは簡単で、面倒なのはこっち
> input.type は今の所 text select と checkbox だけです

フォームの中身を全て保存して戻すってのは
以前に実装したことあるけど、
typeみてselectだったら〜checkboxだったら〜みたいな
コードを書いた記憶がある。意外と面倒くさい

12 :
inputのtypeでselectってなんだ?教えてクレヨン

input type="file"があったら面倒なことになりそうな
そうでもないか?

13 :
>>12
その質問に答える必要はない

14 :
あー、でもidで見分けるのか。inputっていうからnameで見分けるのかと思った

var data = {};
$(":input").each(function() {
 switch(this.type) {
 case 'checkbox':
  data[this.id] = this.checked;
  break;
 default:
  data[this.id] = this.value;
 }
})

データをかき集める所はこんな感じかな
idでユニークになるならserializeArrayみたいに配列で持たなくていいね。
ちなみにmultipleなselectには対応していない

こんな風にtypeを使って見分けることになるんで
> input の数や種類に依存せずにかけませんか?
に関しては、書けません。というのが答えになる。

15 :
>>13
<input type="select"> が存在しないかもしれない、と自分を疑うことから始めた方がいいよ
https://html.spec.whatwg.org/multipage/input.html#attr-input-type

16 :
>>15
時間の無駄。わかってる結論へ至る道はお前1人で勝手に進んでろ

17 :
どこかポエムだな

18 :
>>11
serializeArray は、送られる属性が少ないし、
successful controls しか送られていない

使いどころが難しそう

19 :
送られる属性ってなんや?

フォームのGET・POSTで送られる情報の
全てを網羅してるぞ?

20 :
serializeArray を使うなら、name, value を使うように統一しないといけない。
type, id が無いから、使いずらいかも

input.type には必ず、text, select, checkbox を指定しておけば良いかも

21 :
serializeArray を使う場合、type, id が無くても、

name, value を使って、name がユニークなら、コントロールを特定できるのか

22 :
formだと既存のjsコードと衝突したらかなわんし
ほぼ同一のformが複数あるなんてしょっちゅうあるから
汎用性なんて考えない方がいい気がする

23 :
<select name="single">
<option>Single</option>
<option>Single2</option>
</select>

select は、input タグじゃないのか

24 :
jqueryを使った時のデバッグが面倒臭すぎる

25 :
>>16
分からない場所に突き進む道を選ぶのね、ご愁傷様

26 :
>>25
俺はそんな道に進まないって意味だよw

27 :
トイレ事情も地方によって様々だな

28 :
九州は汲み取り式とか四国はベルサイユ宮殿式とかそういうのがあんの?

29 :
雑多な要素を後から保存するのは無理がある
データの作成・保存はカスタムエレメントで閉じておくべき
例のvalueの問題はinputやtextareaを継承してonchangeで見てもいいが
contenteditableとして要素ごと作ればobserveも統一できるし見た目の調整もやりやすい

30 :
なんでトイレ事情なんだよ

31 :
>>26
正しい仕様を確認するための質問を無視する→理解の放棄

32 :
悲しきjser

33 :
>>15
HTMLはその場合の操作も定義されている
>>The type attribute ...... the invalid value default are the Text state.

34 :
>>33
そりゃそうだが、将来的にtype属性値の種類が増えるかもしれんし、わざわざ不正値を指定する理由はあるまい

35 :
まだ到着してなかったのかよw
俺は最初からわかってる結論へ至る道の到着点にいるぞ?w

36 :
分かっている人は>>11を書かな

37 :
type typer

38 :
じ え ん

39 :
selectボックスで、10番目の要素を自動的に一番上までスクロールさせる方法ってありますか?

40 :
         /::::::::ソ::::::::: :゛'ヽ、
         /:::::::-、:::i´i|::|/:::::::::::ヽ
        /::::::,,、ミ"ヽ` "゛ / ::::::ヽ              <  一億総活躍
       /::::::==    卍   `-::::::::ヽ
      l::::::::/ .,,,=≡,  ,≡=、l:::::::l       /. ̄)        英訳は「Promoting Dynamic
      |:::::l゛  .,/・\,!./・\ l:::::::!     /  /二、.
      |`:::|  :⌒ノ/.. i\:⌒ |:::::i     丿 Y  .i  Y      Engagement of All Citizens」
       (i ″   ,ィ____.i i   i //   ( ゝ'  ノ ./ /
       ヽ i   /  ■ .i  i /     ,ゝ-、_)--'-'         (全国民の精力的な参画の推進)
        l ヽ ノ `トェェェイヽ、/´     /{ ゝ、__ハ|ヘ
        /|、ヽ  `ー'´ /      ィ'/ハ____ハ       つまり国家総動員
      //l ヽ ` "ー−´/     ////////////ノ
    ,,ィ''"/// | >< ////////////{///////////
  r''"////// ..|/:::::ノ//////////////}/////////Y
  ////////|  /:::::{///////////////{//////////

41 :
Javascriptのデータ型って先に指定できないのか?
int Number;
とか
string name;
とかは

42 :
typescript使うしかないかな

43 :
データ型を指定できてたら良くなかったことはたくさんある
例えばここ何年か今までintだったDOMの値が
高画面解像度デバイスのためにfloatになってきる

44 :
>>43
それは型キャストで解決できる程度の問題かな
floatを返していても型がintだったら自動的に
小数点以下切り捨てられる
むしろその方が想定しない型にならないのでいいかもね

45 :
>ここ何年か今までintだったDOMの値が
>高画面解像度デバイスのためにfloatになってきる

どういうこと?

46 :
4Kとかだとコンテンツ全体表示できるから要素固定して表示するようなソリッドレイアウトよりも
リキッドデザイン的なものに変わってきた、ということでは

47 :
2^32-1を超える値扱ってんの?それとも小数点以下の値が来てんの?どこで?ってことなんだけど

48 :
DOMの値てなに

49 :
ドムドムドム

50 :
一時そういう話があったがここにあるように今はまたintに戻った
https://www.w3.org/TR/cssom-view/#changes-from-2013-12-17
だけどChromeではまだサポートされてて
ズームしてdocumentElement.scrollTopなんかを弄ると分かる

200%以上に拡大すると分かりやすいだろうけど
特に低スピードのスクロール時にここで実際に役に立つことが分かる
http://output.jsbin.com/qedore

51 :
intじゃなくてlongか

52 :
別に入ればなんでもいいんだけどいつもvarで型を作って自動でやってるから
Javascriptの基本的な型の作り方はvarなのかなって

53 :
朝鮮人みたいに揚げ足とる根性悪い奴がいるな

普段何の仕事してんの?
ニート?

54 :
根性悪いやつが居るように見えるのは本人が根性悪いんだろうな

55 :
朝◯人と悪口いってる時点で人の屑
ジャップのくせに

56 :
「朝鮮人」は今や悪口ではないし
「JAP」は昔は米国新聞でも普通に使われてたただの略語というか日本の愛称だった
たかが三文字の言葉であれこれ思うのも馬鹿らしいよ

57 :
ヴァーカ

58 :
リアルで朝◯人なんて言ってみろよ
どう言うことになるか分かるか?

リアルで言えない差別用語をネットで
使って吠えてる糞野郎

59 :
某氏のカメラの話思い出した

60 :
>>58
意味分からん
中国人
フィリピン人
朝鮮人
普通に使うぞ

変な嫌悪感を持ってるのはそういう学校教育された中年世代だけだろ

61 :
【研究】飲むだけで差別主義者が更生する「道徳ピル」
>米国では、多くの学生が成績向上や適性試験をパスするために、リタリンを治療以外の目的で服用しているとの報告がある。

差別主義者は薬物でも服用させなければ駄目だな
市ぬかもしれないが生きてても仕方ない奴らだからどうでもいいわ

62 :
>>60
韓国人 は入らないんか

63 :
知能が低いと複雑なことを考えられないから
極端な白黒思考になる
これが差別主義者

道徳ピル飲んで知能を上げるしかない
薬害で市んだら害虫が一匹消えたという事でそれはそれでおっけ

64 :
>>50
言葉で説明してくれ

65 :
DOMは仕様がコロコロ変わる
だからその違いを吸収するライブラリが必要になる

66 :
逆だな
原則DOM標準は後方互換性を守る
JSのライブラリはバージョンアップで簡単に切り捨てる
ライブラリを使ってるとむしろ追従が大変になる

67 :
自分の引き出しにあんまり実例なくてわからないんだけど
バージョンアップで切り捨てるって旧UAを?だったら旧バージョン使い続ければ良いのでは?

68 :
uaって?無駄にコンテキストから推測させないでほしい。
あなたは数文字節約できるかもしれないけどこっちはいい迷惑。

69 :
>>67
パフォーマンスや新機能のためにバージョンアップしたくても
再設計が必要なほどAPIが大きく変わってることが珍しくないということ
YouTubeのCr以外で遅い問題もPolymerがそうだからYouTubeが追従できないから

70 :
crって?無駄にコンテキストから推測させないでほしい。
あなたは数文字節約できるかもしれないけどこっちはいい迷惑。

71 :
>>66
> JSのライブラリはバージョンアップで簡単に切り捨てる
> ライブラリを使ってるとむしろ追従が大変になる

どのライブラリ? AngularとかReactとかかな?
なんか更新頻度高いしね

その点jQueryは安定していていいよ。
そもそも追従するほどバージョン出てないしw

72 :
>>69
それ、単にそのライブラリ・フレームワークの設計が杜撰ってことじゃ
その互換性の部分以外のとこも大丈夫なのか?となりそう

73 :
angularって言うほどいいかな?
偉そうな事言うのは嫌なんだけど
vueやreactの方が絶対いい

74 :
>>72
杜撰ってわけでなくJS界のトレンドなんだろうな
jQueryみたいに切り捨てられないと(それでも利用度からすれば比較的切り捨ててる方)
負の遺産化するし

75 :
>>74
jQueryは負の遺産にはならんよ。
DOM操作を短く簡潔にするためだけのものだから
使わないならjQuery1行をそのまま数行に対応付けて書き直せる
冗長になりますよってだけで誰もやらないけどね

負の遺産っていうのはAngularやReactなどの
最近のフレームワーク。違う書き方にしようとしたら
全体に手を入れなければいけない

76 :
フレームワークは離脱するには設計から構造からやり直さないといけない
jQueryのようなライブラリは設計構造はそのままで済む場合が少なくない(※)が使用部分が広範になりがちで書き直し量が多い
※例えばアニメーション関係をjQueryに頼っていると構造にも絡んでくる
独特な機能を提供するライブラリは関係部分だけ書き直せば済むといえなくもない

77 :
フレームワークで作られるのは迷惑。
意識高い系の人がフレームワークで使って作ったサイトをサーバに乗せるのに凄い苦労した経験あり。

78 :
jQueryで唯一評価されるのはSelectorsAPIの基礎になったってことだけ

79 :
element.style="width:100px;background-color:green;";
でいけたんだけど、element.style.width="100px"みたいにプロパティと値をわけて書くのと何か違いはありますか

80 :
パース速度?

81 :
可読性がよくないぐらいでは
element.setStyle({
 "width": "100px",
 "background-color": "green",
});
とかがあればいいな
prototypeいじりたくないけど

82 :
>>79-81に便乗質問なんだけど
・element.styleにはCSSStyleDeclaration オブジェクトが入ってる
・element.styleに直接CSS定義テキストを代入できる
・element.styleに直接CSS定義テキストを代入した直後でも
 element.styleにはCSSStyleDeclaration オブジェクトが入ってるし
 element.style.width を変更することもできる

CSS定義に変更があった場合変更内容を元にelement.styleを再設定してるという感じだと思うんだけど
こういう挙動はどう理解したらいい?

より具体的には、ブラウザの実装がそうなってるというだけなのか
それとも同じような挙動をユーザがjsコードで実現できるのか

83 :
>>82
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Proxy

84 :
>>81
Object.assign(element.style,{
 width: "100px",
 backgroundColor: "green",
})

>>82
内部Proxyだと理解したら良い

85 :
>>78
SelectorsAPIなんてjQueryの劣化版だろw

単にNodeListを返すだけで、そのNodeListを扱う方法まで作らなかった
jQueryはNodeListみたいに単に要素の配列を返すのではなく
要素の配列を内包した、jQueyrオブジェクトを返すことで
要素の配列そのものをメソッドで操作できる

ここが重要な所なのに、SelectorsAPIはそれを理解せず
単に要素の配列を返しただけ

86 :
jQueryはいつgetContextに対応してくれますか
あとマウス座標取得決定版みたいなのも欲しいです
$(event)みたいにできたらいいのにな

87 :
>>83-84
thx
あるんだな・・・意義はわかんなくはないけど正直どうかと思うが・・・
あとでじっくり読んでみる

88 :
>>86
getContextに対応するだけでいいの?
canvas自体に対応しないとあまりメリットなくない?

jQueryになれてるなら、D3.js を使うのが良いと思う
canvas操作をjQueryライクに書くことができる
俺も普段はjQueryを使うけど、canvasを操作したい場合はD3.jsを使うよ

こんなk何時
https://codezine.jp/article/detail/7459

> D3.jsのセレクタを用いて宣言的に記述すると、以下のように簡潔に記述することができます。
> d3.selectAll("p").style("color", "white");
>  コードも、d3.selectAll("p")ですべてのp要素を取得、style("color", "white")で
> 文字色を白に設定、と直観的で分かりやすくなったのではないでしょうか。

89 :
>>86
> $(event)みたいにできたらいいのにな

$(window).on('mousemove', function(event) {
 console.log(e.screenX);
 console.log(e.screenY);

 console.log(e.pageX);
 console.log(e.pageY);

 console.log(e.clientX);
 console.log(e.clientY);

 console.log(e.offsetX);
 console.log(e.offsetY);
});

90 :
あ、間違った。

× console.log(e.screenX);
○ console.log(event.screenX);
以下同じ

91 :
>>87
今だったらもしかしたらゲッターセッターになるのかもしれないけど
それらがJSに無かったころからCSSOMはあるしね
配列のlengthのようなものだよ

92 :
array.lengthはちょっと違うのでは
array.lengthを書き換えても即座に自動的に書き換えられたりしないだろう

93 :
するよ
TypedArray の様にゲッターやセッターではなく
プロパティアクセス時に0や1などと同等にフックして内部プロパティを変更してる

94 :
JavaScriptって最近、変数に型つけたり、クラスを作ったりするらしいけど
もはやそれActionScriptじゃねーの?

95 :
変数に型は付けないよ。

96 :
>>94
昔ES3(ECMAScript 3)っていうのがあって、その後普及したのがES5
今はES6という名前だったのがES2015に変わって、ES2016だとかES2017だとか・・・

それは良いとして、ES3とES5の間にあったのがES4
ES4の夢は壮大で、クラスベースで型もあって・・・
そのES4に完全準拠することを目標にActionScriptは開発されていた

ところがES4の夢があまりにも無謀で破綻した。
そして型などの機能を減らして現実的にしたES5ができた

ActionScriptは破綻したES4相当なんだよ。消えたES4の成れの果て

JavaScriptに準拠しつつ型を取り入れたのはTypeScript

97 :
A → B → C → D
とasync関数が繋がってるのをイメージしてください
Aから始まりEが完了すれば順にC、Bと完了してAに戻ってくるイメージです

ここで、Dの段階でBからの流れをやりたいとします
しかし、Dの次にBを続けると、
それまでのB → Cの流れの中で消費されているメモリが残ってしまいます。

もうDや過去のCやBに戻らせる必要はありません。
しかし、Dを開放してB'を開始すると、Aまで完了してしまい、それはよろしくありません。

A → B → C → D
まで来たところで
A → B → C → D → B' → C' → D'
となるのはメモリリークしやすく、チェーンが非常に長くなると色々なバグも発生しやすく
デバッグのしやすさにも関わってくるので避けたいです

とはいえ
A → B → C → D -...> B' → C' → D'と切り離すと
Aで行っている初期化・完了・例外処理から外れていってしまうため問題です

理想的には、チェーンをA → B' → C' → D'
とつなぎ直したいのです
どうしたらよいでしょうか

98 :
ただの再帰とちゃうの

99 :
設計段階でみょうちきりんな動きの要求を加味しとけよ

100 :
仕様としては、どの処理進行状態でもリセット、ぶつ切り行為が発生しうるという状況です
一応今はBで作業キューを持ってそれにCを追加する形にしていますが、
いかんせんコードがキレイではありませんし、僅かな仕様妥協が入ります

おそらくPromiseのラッパー的なとこから、根本的な非同期チェーン構造を
素朴なPromiseではなく1から考え直して別の物にすべきだと思うのですが
いいアイディアは無いでしょうか

全てのasync、async generator関数でCancelの概念と実装をしたら良いのでしょうか
全てのawait時にそれがCancelかどうかチェックして処理をするとか
それはそれで漏らせないコードが多くなりそうですし、処理が複雑になりそうです

一応今は各処理にセッションを渡すようにしていて、表に影響がある処理ではそのセッションが切れていたら何もしないことで、
特にイベント等から繋がる不要なチェーンが発動しても空回りさせることで影響がないようにしています
今はメモリの開放は時間経過やイベントをあえて見捨てたチェーンに伝わらせて
空回りを利用して自然と勝手にほぐれて、その後GCが回収してくれることに頼っています

しかし、今回は下手に空回りもさせたくないという状況です
コードを極力シンプルに保ちながらしっかりしていてかつ柔軟性も持った非同期処理構造を作るにはどうしたらよいでしょうか

例えば非同期でも、場合によっては完了を待たずに次に進みたいことってありますよね
例えば、Loadingを表示するとき
await View.fadeInLoadImage()
let file = await Network.fetchFiles( )
await View.fadeOutLoadImage()
とするとフェードイン、アウトの時間が無駄なので
View.fadeInLoadImage()
let file = await Network.fetchFiles( )
View.fadeOutLoadImage()
とすると思います。ですが、このフェードが動いているときに
コンテキストがリセットされると、色々懸念事項が生まれます
そういうのもスマートに扱える方法を知りたいです


100〜のスレッドの続きを読む
_____________________________________________HTA
写真サイト管理人の集い 3枚目
CSS・sass・less・stylus 初心者スレッド=15th=
高飛車極まれり Yahooのビジネスエキスプレス
サイト内検索について話そう。
HTML覚える気がない人のためのホームページ作成ソフト
●●GOOGLE検索は間違いだらけ●●
一般人とweb制作者の見分け方
一般人とweb制作者の見分け方
+ JavaScript の質問用スレッド vol.144 +
--------------------
ザリガニのかっこよさは異常
【アラフォー後半】
【アラサー】婚活ブログヲチ★177【アラフォー】
レーパン+モッコリぷりぷり=変態ピチパン★9匹目
【東京】小池知事が石原都知事時代に集まった塩漬けの尖閣寄附金約14億円の活用を検討
國學院大學硬式野球部 Part13
ゴールデンタイム
【画像】YouTuber「このババアを1RTにつき1分聖夜に指名しますw」→大炎上 [875850925]
掃除のモチベーションが上がるレスをコピペ収集 8
【競馬】 今年のダービー馬 ロジャーバローズが引退 =重度の屈腱炎
【⚫】日本総合スレッド【⚫】
【低刺激】かずのすけ流美容情報交換スレ【弱酸性】
ナンバーズ4 Part346〜ナンバーズ4で逝こう〜
【WWU】第二次大戦ミリタリーフィギュア3【1/6】
【警視庁】首都を守るプライド その39【警察官】
2chでも通る串
ティップマニア(棄民抜き版)
■なぜストーカーになる男が増えたのか?女のせいだ
変な書き込みを貴族が愛でる
【ベアボーン】ASRock Deskminiシリーズ 5台目
TOP カテ一覧 スレ一覧 100〜終まで 2ch元 削除依頼