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

1 ：Name_Not_Found：2019/09/16(月) 17:22:37.92 ID:???.net

JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください

■規則/推奨ルール
質問者は !slip:vvvvv を名前欄に、その後は「レス番」＋!slip:vvvvv
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」から解離した議論はよそでやること。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
　1レスに収まらないならコード投稿サイトを利用してください。
　http://jsdo.it/　http://jsbin.com/　http://jsfiddle.net/　http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける＝荒らしです

■前スレ
+ JavaScript の質問用スレッド vol.141 +
https://mevius.5ch.net/test/read.cgi/hp/1562318008/

953 ：Name_Not_Found：2019/12/26(木) 23:55:07.87 ID:???.net

初心者すぎてすいません
getElementById
ってどういう意味ですか？
Ｉｄをつけた箇所に来たら何かを稼働させるって事ですか？

954 ：Name_Not_Found：2019/12/27(金) 00:10:53.62 ID:???.net

>>953
引数で指定されたIDを持つHTML要素のオブジェクトを返す

955 ：Name_Not_Found：2019/12/27(金) 07:23:20.20 ID:???.net

>>953
たとえばキミがElementだとしてIdがtaroだったとする
で、おれがgetElementById('taro')するとキミ（taro）を取得し
キミの服装を変えたり、しゃべらせたり、歩かせたり、髪型を変えたりできる
例）
var taro=getElementById('taro'); //取得
taro.style.color='blue'; //taroElement内の文字の色を変える

956 ：Name_Not_Found：2019/12/27(金) 09:00:30.12 ID:???.net

多次元配列をディープコピーしたいのですが
var arr=[['a','b'],['c','d']];
var arr2=JSON.parse( JSON.stringify(arr) );
arr2[1][0]='e';
console.log(arr,arr2);
これ以外だと配列ループするしかないですか？

957 ：Name_Not_Found：2019/12/27(金) 09:54:17.16 ID:???.net

>>956
ループとは？
何を使おうが、配列の要素を走査する処理は走る

958 ：Name_Not_Found：2019/12/27(金) 13:46:19.56 ID:???.net

>>957
配列は広義の意味ではなく上の例だとarrのループです
Arrayのみならこんな感じでしょうか？↓
var deepCopy=function(obj){
var arr=[];
if(Object.prototype.toString.call(obj)==="[object Array]"){
obj=obj.concat();
for (var i=0;i<obj.length;i++){
arr.push(deepCopy(obj[i]));
}
}else{
return obj;
}
return arr;
}
var arr=[["a","b"],["c","d"]];
var arr2=deepCopy(arr);
arr2[1][0]="e";
console.table(arr);
console.table(arr2);
Arrayだけじゃないともっと複雑になりそうな気がしますが
JSON.parse( JSON.stringify(arr) );以外になにか方法ないのかなと思いました

959 ：Name_Not_Found：2019/12/27(金) 18:23:26.91 ID:???.net

再帰

960 ：Name_Not_Found：2019/12/27(金) 20:11:41.00 ID:???.net

function deepCopy ( obj ) {
return new Promise( done => {
let mc = new MessageChannel
mc.port2.onmessage = e => done( e.data )
mc.port1.postMessage( obj )
} )
}

let ary1 = [ [ 'a', 'b' ], [ 'c', 'd' ] ]
let ary2 = await deepCopy( ary1 )

961 ：Name_Not_Found：2019/12/27(金) 20:39:16.22 ID:???.net

jQuery のdeepcopy。
var newObj = $.extend(true,{},sourceObj)

javascriptでlodashを使ってディープコピーを簡単に行う
https://qiita.com/t-motoki/items/5685d302e2e242f561b4

962 ：秀丸使いのtaro：2019/12/27(金) 20:56:51.70 ID:???.net

>>955
す、す、すげええ
わ、わ、わかりやすい
感謝っす
javascript頑張ります！！

963 ：Name_Not_Found：2019/12/27(金) 21:47:31.29 ID:???.net

>>958
>>956の「配列ループ」の説明になっていないようだが？

二次元配列にdeepcopyなど不要
var array1 = [["a","b"],["c","d"]];
var array2 = array1.slice().map(array => array.slice());
console.log(JSON.stringify(array1) === JSON.stringify(array2));

まあ、deepcopyが必要となる状況がそもそもないようにコードを組むがね
DOMのcloneNodeのように、新しい概念上で必要な場合もあるが、それも新しくclassを作って複製可能なように作っておく

964 ：Name_Not_Found：2019/12/27(金) 22:44:10.72 ID:???.net

本当に全プロパティを複製する必要があるのか？
Proxyを作って更新があったものだけキャッシュしとく方が効率的なこともあるだろう

965 ：Name_Not_Found：2019/12/27(金) 23:56:52.55 ID:???.net

こんにちはをこんばんはに変更する場合、パターン１とパターン２のどっちがナウいですか？
原宿とかのスタバでコーディングしてて、エンジニアにチラ見されて恥ずかしくないのはどっちですか？

【パティーン１】
index.html
<p>こんにちわ</p>
script.js
$('p').text('こんばんは');


【パティーン２】
index.html
<p>こんにちは</p>

script.js

$('p').html('<span>こんばんは</span>');

966 ：Name_Not_Found：2019/12/28(土) 00:22:24.26 ID:???.net

ナウくしたいならVueとか使えば

967 ：964：2019/12/28(土) 00:38:20.32 ID:???.net

>>966
ナウ過ぎるのも嫌なんだよ
>>965でパティーン１と２でどっちがいいの？

968 ：Name_Not_Found：2019/12/28(土) 05:10:46.87 ID:???.net

スタバでindex.htmlとscript.js睨みながら$("p")とかやってんのがいるの想像するだけで笑ってしまった

969 ：Name_Not_Found：2019/12/28(土) 05:53:56.36 ID:???.net

>>959,960
ありがとうございます
awaitとか調べてみたいと思います

>>963
再帰と考えてくれればいいと思います（単にコードを書くつもりでarrをループする具体的な部分を示したので）。
二次元配列というか多次元配列（>>956）です（例は２次元配列ですが）
こちらの管轄に無い配列をコピーしたいときとかですね
理想は配列以外のオブジェクトも含むケースですがまずは配列のみからやってみるという感じです

970 ：Name_Not_Found：2019/12/28(土) 07:27:59.12 ID:???.net

>>967
どっちもダサい

971 ：Name_Not_Found：2019/12/28(土) 08:00:03.47 ID:???.net

>>965
１だろ。２はそもそもspanが間に入ってるので意味が変わってしまってる

972 ：Name_Not_Found：2019/12/28(土) 08:20:35.64 ID:???.net

説明してあげると、どちらもダサいって言ってる人は、タグpを使ってるからだよ。
pは普通たくさんあって他の用途でも使われるのでp全部をこんばんはに
したいことはまず無いだろうなという前提に経てば、そういうことはしない。

idを使うと言い出すやつがいるかも知れないが、一番いいのはclassを使うこと。
そうすれば変換したいこんにちはが一つでも複数でもコードは変換しなくて良くなる。

<p class="greeting">こんにちわ</p>
$('.greeting').text('こんばんは');

つまりこういうのだな。もっといいやり方は。


だがそもそもJavaScriptで文字を変えるべきことなのか？という話がある

<body data-timeframe="daytime">
<p class="daytime greeting">こんにちわ</p>
<p class="night greeting">こんばんは</p>
</body>

.greeting { display:none }
[data-timeframe="daytime"] .daytime.greeting { display:block }
[data-timeframe="night"] .night.greeting { display:block }

例えばこういうCSSとHTMLを書いておけば、data-timeframeを
daytimeにするかnightにするかで、こんにちわやこんばんはが自動的に変わる
応用で色んな部分を変えることができる。

jQueryでやるのは、このようにclassとか今回はdata-*属性を変えるだけにするもんだよ。
JavaScriptでHTMLや文字列を切り替えるのはバッドパターン

973 ：秀丸つかいのtaro：2019/12/28(土) 13:24:12.01 ID:???.net

>>972
て、て、テクニシャンかよ
何年でそこまでのレベルに到達したの？
ちょっと憧れてしまったお

974 ：Name_Not_Found：2019/12/28(土) 13:59:30.01 ID:???.net

上の部分は、１行目のhoverでポインタが,languageの上に乗った時に、fadeInするって意味だと思うんだけど
下の部分は、ポインタが外れた時っていう意味の単語みたいなの無いけど、なんでポインタが外れたらfadeOutするの？
なんでですか？


$('#language-wrapper').hover(
function() {
$('.language-text').fadeIn();
},



function() {
$('.language-text').fadeOut();
}
);

975 ：Name_Not_Found：2019/12/28(土) 14:10:51.79 ID:???.net

よく見ろ下も単体じゃなくて上と一緒にhoverメソッドに渡してあるでしょ
https://api.jquery.com/hover/
hoverの第１引数がホバーした時、第２引数が外れた時に実行される関数

976 ：Name_Not_Found：2019/12/28(土) 15:59:23.13 ID:WMd/dG8p.net

>>975
ホバーした時と、外した時で、ワンセットて事だね
そのサイトクリックしたら英語でびびったよ
まあ翻訳ソフト入れたけどね

977 ：Name_Not_Found：2019/12/28(土) 16:00:54.73 ID:???.net

それにしてもあんたら天才だな

978 ：Name_Not_Found：2019/12/28(土) 17:48:20.83 ID:???.net

クオンテーションやダブルクオンテーションを付けたり、付けなかったり
カンマが必要だったり、セミコロンが必要だったり・・・・
こういうのって初心者としてはツライんですが、ずっとやってれば覚えられるものですか？

質問レベル低すぎてすいません

979 ：Name_Not_Found：2019/12/28(土) 18:19:22.66 ID:???.net

覚えるし、大した話じゃないし
vscode＋javascriptの適当なプラグインで
勝手にチェックしてくれるのでどうでもいい

980 ：Name_Not_Found：2019/12/28(土) 18:59:28.29 ID:???.net

半年もやってたら覚えるよ

981 ：Name_Not_Found：2019/12/28(土) 19:04:56.90 ID:???.net

>>978
覚えるものではない
言語なのだから
一々ここではこの構文を使って、とか考えてる内は初心者

982 ：Name_Not_Found：2019/12/28(土) 19:31:54.56 ID:???.net

出たエラーを見ればいい　>>978
文字通りトライ＆エラーでバカでも自然に覚える

983 ：Name_Not_Found：2019/12/28(土) 19:33:41.06 ID:???.net

>>972
こんちわって気分のときとちーっすって気分のときもある場合どうしたらいいのですか

984 ：秀丸使いのtaro：2019/12/28(土) 20:49:29.38 ID:???.net

>>979
VScodeですね
秀丸を捨てる時が来たようです
アドバイスありがとうございます！！

985 ：Name_Not_Found：2019/12/30(月) 10:53:44.39 ID:???.net

アロー関数の、=> この記号ってキーボードのどこをどうやって入力するんですか？
ググっても出てこないという悲劇

986 ：Name_Not_Found：2019/12/30(月) 11:00:55.21 ID:24lzJ5h+.net

>>985
矢印で変換するのとは違うからな

987 ：Name_Not_Found：2019/12/30(月) 11:32:54.78 ID:???.net

>>985
AAだよ

988 ：Name_Not_Found：2019/12/30(月) 12:25:06.25 ID:???.net

2019年もjQueryのシェアは微増で終わりましたね（苦笑）
だから言ったんだよ。誰もがウェブアプリ作ろうと思ってたりしないんだから
普通のウェブサイトならjQueryでいいんだって
適切じゃない技術に乗り換える意味がない

989 ：Name_Not_Found：2019/12/30(月) 13:02:46.75 ID:???.net

>>985
なぜそれが１文字の記号だと思うのか

990 ：Name_Not_Found：2019/12/30(月) 13:06:54.49 ID:???.net

一文字にくっついているからやろ
リガチャって知っとるか？

991 ：Name_Not_Found：2019/12/30(月) 14:15:50.65 ID:???.net

javascript勉強しだして2週間だけどまだ半分もいってないんだが
独学でjavascriptの勉強をして、未経験からIT企業に就職するまでに、何時間くらいの勉強時間が掛かると思いますか？

500時間くらいですか？

992 ：Name_Not_Found：2019/12/30(月) 14:18:16.88 ID:UDiN/Fsc.net

入りたい企業のレベルと自分のスペック晒せよw

993 ：Name_Not_Found：2019/12/30(月) 18:12:47.39 ID:???.net

>>992
Fランクの糞みたいな大学卒（偏差値54）
30代前半で現在の職業は賃貸不動産の案内というカス仕事
タイピングまあまあ速い、付き合った女性の数は40人強、体形はスリム

入りたい企業、聞いた事ないような3流企業でもブラックじゃなければOK
最初は派遣でもOK！これってどう？

994 ：Name_Not_Found：2019/12/30(月) 18:36:06.21 ID:???.net

>>985そのまま、=>（半角英数でイコール、不等号（大なり））と続けて2文字打つのがその書き方だよ、それで合ってるよ
そんな些細なことをちょっと聞けるような勉強仲間もいない中で独学しようと立ち上がった君に温かい拍手を送りたいぞ

995 ：Name_Not_Found：2019/12/30(月) 18:38:25.95 ID:???.net

こんな情弱がプログラミング始めることもあるんだな。

996 ：Name_Not_Found：2019/12/30(月) 18:46:45.26 ID:???.net

>>993
たとえば未経験者歓迎で教えてくれる企業に入って、経験を積んでから転職していく道もあるので
大事なのは何時間やったかではなくて、何時間かやって自分に向いてると思うかどうかだね。

本当に楽しくて仕方がないのなら、会社に入るとむしろ苦痛になるのでいきなりフリーランスっていうのも、最近なら十分考えられるし。

997 ：Name_Not_Found：2019/12/30(月) 18:50:58.57 ID:???.net

でも30代か
色んな経営者とか、業界で有名な人と話したり、言ってるのを聞いた感じだと０から始めるのは30が限界って考えてる人が多そう。
ならクラウドワークスとかで副業として始めて、行けると思ったタイミングで切り替えるのがいいかもね。

998 ：Name_Not_Found：2019/12/30(月) 19:06:29.17 ID:???.net

30代とか関係あるかな？35歳で入ってきて出世していく人もいれば
大学卒業してすぐ入ってきてもメンヘラになって全く何も出来ないようなの普通に居るぞ
言語が新しいバージョンになったら対応できないんだよそういう人は

999 ：Name_Not_Found：2019/12/30(月) 19:23:01.96 ID:???.net

>>996
いきなりステーキみたいで楽しそうですね
いきなりフリーランスやってみようと思います
スクールにも通うつもりです

1000 ：Name_Not_Found：2019/12/30(月) 19:49:09.65 ID:???.net

>>995
こういうのもたぶん初心者

1001 ：Name_Not_Found：2019/12/30(月) 19:55:30.72 ID:???.net

うむ。俺は始めてから6年くらいの初心者だ。

1002 ：2ch.net投稿限界：Over 1000 Thread

2ch.netからのレス数が1000に到達しました。