元スレ+ JavaScript の質問用スレッド vol.142 +
JavaScript覧 / PC版 / みんなの評価 :
151 :
JSONの発明者ダグラスクロックフォードはJSへのクラス構文導入に大反対だった。
http://qiita.com/ikedaosushi/items/45652e53c06c761d8137
奇しくもクラス大好き言語JavaはXML大好きである。
クラスおじいちゃんはJSONを使わないように。
152 = :
任天堂の初期のマリオでも、アセンブラで、オブジェクト指向で書いていたとか
同様に、C など、オブジェクト指向ではない言語でも、
苦労すれば、オブジェクト指向で書ける
でも、そういう言語は、オブジェクト指向とは言わない
オブジェクト指向の言語とは、オブジェクト指向を簡単に書けるものだけ。
つまり、クラス構文を持つものだけ！
153 = :
クラス構文は介護用言語の証。
go言語もhaskellもクラス構文なんてない。
一方jsはes2015でおじいちゃん介護言語に成り果ててしまった…
154 = :
Rustもクラス構文なんて無いね。
イケてる言語はみんなない。
それは偶然ではなくて、長年のC++/Java型のクラスベースオブジェクト指向で段々明るみに出てきた問題点を反省して、その問題に対する答えをそれぞれ言語仕様に盛り込んで来てるからなんだよね。
脳死でJavaパクったRubyみたいな要介護言語なんかとは心意気が違う。
JSも同類になったｗｗ
156 = :
> Rustもクラス構文なんて無いね。
> イケてる言語はみんなない。
イケてない言語では？
議論に参加して良いのはイケてる言語になってからだよ。
157 :
webSQLって開発とまってるらしいけど
いちおうひととおり使えるれべるにはなってるかな？
indexedDBがわけわからんしＳＱＬの勉強もかねてつかってみたいんだけどどうなんだろ
158 = :
止まってるんじゃなくて放棄されてる
IndexedDBが堅苦しいなら使いやすいライブラリを探す事をおすすめする
http://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API#See_also
159 = :
>>157
廃止が決まってからも長い間残されてたけどchromeは遂に次のバージョンから削除されるってよ。
160 = :
>>26です
ガワが完成し一応はリリースできるものに仕上がったのですが
どうしても音の遅れが気になり色々調べた結果
どうもaudioを使用する場合遅れはしゃあないって結論になりました…
㍉ｾｯｸ単位の気にしなければ気にならない遅れですがどうしようもないようです
解決するにはweb audio APIを使うしかないみたいだけど知識０だしどうすっかなあ…
161 = :
いい機会だから覚えなよ。tone.js使うとか…
162 = :
下記jQueryのeasing関数をjavascriptのみで作った動作に組み込みたいのですが、
引数の x, t, b, c, d, s の内、x と s の説明が見当たりません。
何を指しているかわかる方がいらっしゃいましたら教えてください。
http://github.com/danro/jquery-easing/blob/master/jquery.easing.js
x と s を含まない関数では、しっかりアニメーションしています。
163 = :
>>162
sはマジックナンバーでググれ
xを使う関数なんてねーよ
164 = :
>>161
そういたします…
調べれば調べるほど自分の欲しい機能がついててもうなんで始めから使わなかったのかと…
情報がそれほど多くなく説明が専門的で理解できるか微妙ですが
幸いあげて下さった簡易版？ライブラリもあるみたいなので頑張ってみます
ありがとう
166 = :
>>163
レスどうも！
x については一部で使って入るようです･･･
ちょろっと調べたところ、null が代入されていると考えてよいのでしょうか？
easeInBounce: function (x, t, b, c, d) {
return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
},
また、マジックナンバーについても調べましたが、どういった関連性があるのでしょうか？
下記で言うと、何か値を入れるか入れないかで処理が変わるようですが･･･
とりあえず 0 でも入れておけってことでしょうか？
easeOutBack: function (x, t, b, c, d, s) {するってこと
if (s == undefined) s = 1.70158;
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
}
不勉強ですみません･･･
167 = :
http://void.heteml.jp/blog/archives/2014/05/easing_magicnumber.html
168 = :
>>167
即効ありがとうございます。
熟読します！
170 = :
>>162
調べるなら、公式サイトをあたれ
http://gsgd.co.uk/sandbox/jquery/easing/
> † this is an extra parameter not needed for the equations, but necessary for compatibility with jQuery
どのインターフェースに寄せたのか知らんが、無駄な設計にしか見えんな
内部コード上もthisを使えばいいのに、jQuery.easing.easeOutBounce() をわざわざ直接呼びだしているし、作者はよくわかってないんじゃないかね
> easeInBounce: function (x, t, b, c, d) {
> return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
> },
172 = :
var n=2;
n=3-n; //1
n=3-n;//2
n=3-n;//1
こんな感じで 0,1,2,0,1,2,0,1,2…みたいに３つの数字繰り返す感じのやつ教えてください
（関数以外でできないものか気になったのです）
173 = :
答えを貰う度に、華麗にスルーして、新しい質問を量産する実験でもしてるのかな
175 = :
>>174
うおおできました！ ありゃす！！
176 = :
いいってことよ
177 = :
>>174
他人のコードで課題提出するのってどうなんだろうね
179 = :
>>178
やるじゃん
182 = :
なんでそういう仕様になってるんだろ？
引き続き.next()やらofやら...やらしたいぜ！
183 = :
>>181
nをクリアしないならbigintでやるべき
184 = :
その必要はない。プログラムよく読め。
185 = :
初学者です、色々勉強させて頂いてます
たとえばボタンを押した時などに、動的に画像をずらっと一覧で表示させたく、
text += '<div><img src="./image.jpg"></div>'
をループで回したのち、しかるべき要素内にappendなりinnerHtmlなりして挿入を試しています。
たとえば1000件だとChromeだと一瞬なのですが、Edgeだと1秒近くかかってしまいます。
console.timeなどでどこが遅いかを調べてみると、遅いのはforではなく、appendなどのDOM追加部分であることは分かりました。
DOMの追加の方法は様々あるようですが、いずれもEdgeだと大変遅い状態です。
テンプレで、各種ブラウザによって最適化が異なる、との文言を見ましたが、例えば上記の件だと、高速に挿入するには他にどのような手法が考えられそうでしょうか。
186 = :
>>185
DocumentFragment
187 = :
程度の問題でchromeだろうが何千何万ものDOM要素を扱うとやっぱり重い。
バイナリエディタ作ってるときにその問題に遭遇して、googleのスプレッドシートどうやってるんだろうと思って見てみたらなるほどCanvasで実装されてた。
188 = :
>>187
昔、エクセルのスプレッドシートみたいに
縦横のテーブル＋上と左のヘッダ（A1 A2 みたいなやつ）を
作ろうとしたら難しかった（その時は諦めた）事があるよ
テーブルの内容とヘッダを同期させて
"スムーズに"スクロールさせようとしたけど無理だった。
DOMではそんなこともできないんですよ。
189 = :
>>188
昔は知らないが今はposition: stickyとかあるし簡単に出来るような気が…
>>187で言ってんのはあくまでパフォーマンスの問題ね。
読み込んだファイルを1バイト16進テキスト一つ当たり1DOM要素に割り当てたら、軽いファイルなら全く問題ないのだが数百キロバイトのファイルだともうガッタガタだった。
googleみたいにcanvasで実装せず、あくまでDOMにこだわるならinfinite scrollみたいなDOM要素使い回しの実装をやらないとダメだろうなぁ。
190 = :
>>187
「1000個のdiv >>185」「何千何万のtable >>187」では状況が違い過ぎなのでは？
191 = :
なんだろ、htmlテキストからDOM構築するのに時間かかってるのかな？
src付きimgタグ1000個だもんな。
document.createElement('img')で一個作って、
ループ内で.clone()して.src設定してdocumentFragmentにappendしてみては？
192 = :
documentFragment、試させて頂きました
DOMへの追加が爆速になり感動しました
一方、今度はそのdocumentFragmentの生成時に大きく時間がかかるようになりました
というのも、どうやらcreateElement(img)に対する
setAttribute(src,./image.jpg)が重いみたいです
そこで、>>187で出していただいたcanvasをヒントに、imgタグを使うのをやめて、
createElement(canvas)後、それに対しdrawImageし、Fragmentに追加してみたところ、高速になりました(画像はループ前にnew Image)
Edgeが異様に遅いのはimgタグのsrc指定が問題だったのでしょうか、srcが空の場合はいずれのブラウザも良い速度でした
>>191で出していただいたやり方も試してみたいとおもいます
1000というのは適当な数で、実用上はたかだか300程度のものなのですが、それでも大きく差があったため疑問になった次第です
様々な回答ありがとうございます。
195 = :
Firefoxではこのようにdialog生成時点で表示倍率が高い場合に、合わせて小さくなります
ちなみにCSSでの長さ指定がvwやvhでは、スマホブラウザでの実際の文書の表示領域(viewport)ではないので、以下のCSS変数を設定して正確に軽量で実装できています
ここのwindow.innerWidthが、Firefoxでは固定されず表示倍率で変動します
let vw = window.innerWidth/100, vh = window.innerHeight/100, vmax, vmin;
if(vw >= vh){ vmax = vw; vmin = vh; }else{ vmax = vh; vmin = vw; }
document.documentElement.style.setProperty('--vw', `${vw}px`);
document.documentElement.style.setProperty('--vh', `${vh}px`);
document.documentElement.style.setProperty('--vmax', `${vmax}px`);
document.documentElement.style.setProperty('--vmin', `${vmin}px`);
(()=>{
let timeoutId;
window.addEventListener('resize', () => {
clearTimeout(timeoutId);
timeoutId = setTimeout( () => {
vw = window.innerWidth/100;
vh = window.innerHeight/100;
if(vw >= vh){ vmax = vw; vmin = vh; }else{ vmax = vh; vmin = vw; }
document.documentElement.style.setProperty('--vw', `${vw}px`);
document.documentElement.style.setProperty('--vh', `${vh}px`);
document.documentElement.style.setProperty('--vmax', `${vmax}px`);
document.documentElement.style.setProperty('--vmin', `${vmin}px`);
}, 50);
});
})();
196 = :
連投失礼します
ChromeのGIFにデバッグの数字しか見せてなかった……意図通り動作しているところ入れるの忘れてたので貼っておきます
表示倍率に関係なく、文書の表示領域基準になっているのが判ると思う
197 = :
同じGIF貼ってしまった……本当にすみません
こっちです
198 = :
>>194
常に固定サイズフォントってアクセシビリティが恐ろしく良くない実装だな…
199 = :
objectの要素名って先頭は数字ダメって昔習った気がするのですが今でもダメでしたっけ？
var obj={
"329435e5e66be809a656af105f42401e":"hogehoge",
"73bb3253f355e9f0325b4b0b373d27ba":"fugafuga"
};
こういうのです。問題なくできました
もしかしたら”先頭数字ダメ”というのが記憶違いだったかもしれません
200 = :
クオート無しやドット記法で使えないから初心者向けにそういう説明したんだとおも
前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 次へ
/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで / 
JavaScript一覧へ類似してるかもしれないスレッド
- + JavaScript の質問用スレッド vol.142 + (984) - [100%] - 2020/8/27 19:15
- + JavaScript の質問用スレッド vol.102 + (1001) - [97%] - 2012/9/11 17:30
- + JavaScript の質問用スレッド vol.112 + (1001) - [97%] - 2013/11/27 16:46
- + JavaScript の質問用スレッド vol.132 + (1001) - [97%] - 2018/4/19 11:00
- + JavaScript の質問用スレッド vol.122 + (116) - [97%] - 2018/5/2 18:30
- + JavaScript の質問用スレッド vol.141 + (881) - [97%] - 2021/4/19 9:00
- + JavaScript の質問用スレッド vol.140 + (1001) - [97%] - 2019/9/19 10:45
- + JavaScript の質問用スレッド vol.141 + (1001) - [97%] - 2019/9/22 23:15
- + JavaScript の質問用スレッド vol.143 + (753) - [97%] - 2020/4/19 5:00
- + JavaScript の質問用スレッド vol.144 + (288) - [97%] - 2020/5/17 20:00
- + JavaScript の質問用スレッド vol.122 + (1004) - [97%] - 2015/2/14 4:45
- + JavaScript の質問用スレッド vol.123 + (966) - [95%] - 2020/10/20 2:30
- + JavaScript の質問用スレッド vol.123 + (1002) - [95%] - 2015/4/27 23:30
- + JavaScript の質問用スレッド vol.115 + (1001) - [95%] - 2014/5/29 16:16
- + JavaScript の質問用スレッド vol.121 + (1001) - [95%] - 2015/1/1 18:30
- + JavaScript の質問用スレッド vol.121 + (1001) - [95%] - 2022/11/29 16:30
- + JavaScript の質問用スレッド vol.120 + (1002) - [95%] - 2014/11/8 1:15
トップメニューへ / →のくす牧場書庫について