[javascript] 配列を使ってテーブルデータのソート
- javascriptで配列を使ってテーブルデータのソートをしたいです。
- 上記の配列をソートして特定の順序にしたいです。
- 数値の場合は問題ないのですが、文字列の場合にうまくソートできないようです。
- ベストアンサー
[javascript] 配列を使ってテーブルデータのソート
javascriptで配列を使ってテーブルデータのソートをしたいです。 [ {"t":"a", "n":1}, {"t":"b", "n":1}, {"t":"a", "n":2}, {"t":"a", "n":3}, {"t":"b", "n":2} ] 上記をソートして下記の様にしたいです。 {"t":"a", "n":1}, {"t":"a", "n":2}, {"t":"a", "n":3}, {"t":"b", "n":1}, {"t":"b", "n":2} ] 以下の様に書いてみました。 <html> <head> <SCRIPT LANGUAGE='JavaScript1.2'><!-- var list1 = [ {"t":"a", "n":1}, {"t":"b", "n":1}, {"t":"a", "n":2}, {"t":"a", "n":3}, {"t":"b", "n":2} ]; list1.sort(function(a, b) {return a.t-b.t||a.n-b.n}); var text1=""; for(var i=0; i<list1.length; i++) { text1 += "<br>" + list1[i].t + " " + list1[i].n; } function init(){ document.getElementById("o").innerHTML = text1; } //--></script> </head> <body onload="init()"> <div id="o"></dev> </div> </html> 実行すると下記の様に表示されました。 a 1 b 1 a 2 b 2 a 3 期待してる結果は以下です。 a 1 a 2 a 3 b 1 b 2 なにが悪いのでしょうか？ 因みに、テーブルデータが以下の様に数値だけのの場合、 var list1 = [ {"t":1, "n":1}, {"t":2, "n":1}, {"t":1, "n":2}, {"t":1, "n":3}, {"t":2, "n":2} ]; 実行結果は 1 1 1 2 1 3 2 1 2 2 の様になりました。 数値の場合、 list1.sort(function(a, b) {return a.t-b.t||a.n-b.n}); の式で問題ないのでしょうが、 文字列の場合、この式ではダメなんだろうなと考えてます。 以上、よろしくお願いいたします。
- 小林 K太郎（@kingfruits）
- お礼率66% (211/319)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
しまった、きちんと検証してませんでした。 以下でうまくいくと思います。 list1.sort(function(a, b){return (a.t==b.t)?(a.n>b.n?1:-1):(a.t>b.t?1:-1);});
その他の回答 (2)
- Werner
- ベストアンサー率53% (395/735)
"a"-"b" の結果を確認してみましたか？ 確認してみればこれでは比較できないことが分かると思います。 JavaScriptでは不等号で文字列の辞書順比較ができるので 横着せずに不等号で比較しましょう。 if文を使うなどして、 第1引数が第2引数より小さい(第1引数の方を前に並べたい)場合は負数、 同じ場合は0、 第1引数が第2引数より大きい場合は正数を返すようにするだけです。
補足
ご回答ありがとうございます。 list1.sort(function(a, b) {return (a.t > b.t) ? 1:-1||a.n -b.n}); としてみましたが、 a 2 a 3 a 1 b 2 b 1 となり、期待した結果が得られませんでした。 a 1 a 2 a 3 b 1 b 2 が期待してる結果です。 実は、 return (a.t > b.t) ? 1:-1||a.n -b.n と書いていますが、||の意味がよく解ってません。
- yambejp
- ベストアンサー率51% (3827/7415)
＞list1.sort(function(a, b) {return a.t-b.t||a.n-b.n}); これって文字列を引き算してませんか？ 文字列の比較も不等号がつかえるのでこうしてみては？ list1.sort(function(a, b) {return a.t > b.t||a.n >b.n});
補足
ご回答ありがとうございます。 list1.sort(function(a, b) {return a.t > b.t||a.n >b.n}); としてみましたが、結果は a 2 b 1 a 3 a 1 b 2 となり、期待した結果は得られませんでした。
関連するQ&A
- javascript バブルソート
javascriptでバブルソートの実装をしています。 リストにある数値を取得して昇順 or 降順したいのですがうまくいきません。 方法を教えていただけないでしょうか。 よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <script type="text/javascript"> function bubbleSort(){ var liVal = document.getElementsByTagName("li"); var array = []; for(var i = 0; i < liVal.length; i++){ for(var j = 0; j < liVal.length-i-1; j++){ array[j] = parseInt(liVal[j].innerHTML); if(array[j] > array[j+1]){ var n = array[j]; array[j] = array[j+1]; array[j+1] = n; } } } } </script> </head> <body> <ul> <li>10</li> <li>5</li> <li>48</li> <li>22</li> <li>679</li> </ul> <p><a href="javascript:void(0);" onclick="bubbleSort()">ソート(降順)</a></p> </body> </html>
- 締切済み
- JavaScript
- テーブルソート
お世話になります 今テーブルソートをしているのですがIE,Operaではうまくいったのですがfirefoxでは nodeArray[i].childNodes[k].firstChild has no properties と警告が出てソーティングがうまくできません どのようにすればいいでしょうか？ p.s. 下記のテーブルはCGIで動的に書いたソースをコピーして擬似表示したものです 状況：偶数のonclickが作動せず奇数のonclickがずれてテーブルソートしています onclick(3)でHPのソート、onclick(5)でMPのソートという感じです・・・ 参考にしたサイトや静的に表示したテーブルでは正常に機能することもあります <script language="javascript"><!-- var x=new Array(); var nodeArray=new Array(); var n; function sortTable(k) { if(!document.getElementById) return; n = document.getElementById("ranksort").rows.length; for(i=0;i<n;i++){ nodeArray[i]=document.getElementById("t["+i+"]"); } for(i=0;i<n;i++){ xval=nodeArray[i].childNodes[k].firstChild.nodeValue; x[i]=parseFloat(xval); } sort(); show(); } function sort(){ complete=false; while(!complete){ complete=true; for(i=0;i<n-1;i++){ if(x[i]<x[i+1]){ buf=x[i];x[i]=x[i+1];x[i+1]=buf; buf=nodeArray[i];nodeArray[i]=nodeArray[i+1];nodeArray[i+1]=buf; complete=false; } } } } function show(){ tbody=document.getElementById('ranksort') for(i=0;i<n;i++){ tbody.removeChild(nodeArray[i]); } for(i=0;i<n;i++){ tbody.appendChild(nodeArray[i]); } } //--> </script> <div id='ability box'> <small>タイトルをクリックするとランキングソートされます</small> <table lang="ja" border="1" style='font-size:14px;'> <thead> <tr> <th>名前</th> <th onclick='sortTable(1);'>H P</th> <th onclick='sortTable(2);'>M P</th> <th onclick='sortTable(3);'>力</th> <th onclick='sortTable(4);'>知能</th> <th onclick='sortTable(5);'>信仰心</th> <th onclick='sortTable(6);'>生命力</th> <th onclick='sortTable(7);'>素早さ</th> <th onclick='sortTable(8);'>運</th> <th onclick='sortTable(9);'>人気</th> <th onclick='sortTable(10);'>賞金額</th> </tr> </thead> <tbody id="ranksort"> <tr id="t[0]"> <td>452</td> <td>32</td> <td>15</td> <td>13</td> <td>5</td> <td>5</td> <td>6</td> <td>5</td> <td>10</td> <td>0</td> <td>10000000</td> </tr> <tr id="t[1]"> <td>コス</td> <td>26</td> <td>14</td> <td>6</td> <td>6</td> <td>13</td> <td>11</td> <td>10</td> <td>13</td> <td>0</td> <td>0</td> </tr> <tr id="t[2]"> <td>コスモス</td> <td>30</td> <td>11</td> <td>13</td> <td>13</td> <td>12</td> <td>6</td> <td>6</td> <td>5</td> <td>0</td> <td>0</td> </tr> </tbody></table> </div>
- ベストアンサー
- JavaScript
- JavaScriptの多次元ソートについて
JavaScriptの多次元ソートについて こんにちは。 現在このJavaScriptにArray型にそれぞれソートをかけたいのですが、どのようにすべきでしょうか？ var list = [ {1,Aさん,6,.473,19,9,2,0,1,14,3,2,5,0,5,.583,.736} {2,Bさん,5,.294,17,5,3,0,2,14,4,1,4,0,4,.428,.823} {3,Cさん,6,.333,21,7,1,0,0,8,2,0,2,0,2,.391,.380} {4,Dさん,6,.272,22,6,1,0,0,7,4,3,1,0,2,.304,.318} {5,Eさん,6,.545,22,12,3,1,1,20,15,1,2,0,1,.583,.909} ] お分かりになりましたらよろしくお願いします！
- ベストアンサー
- JavaScript
- 【javascript】ハッシュのキーをソートして取り出したい
ハッシュのキーをソートして取り出したいです。 perlで表現すると、以下の様なかんじです。 foreach $key (sort keys %hash) { ... } そこで、prototype.jsを使って以下の様に書いてみました。 <html> <head> <script type="text/javascript" src="prototype.js"></script> </head> <body > <script > var table = {c:'C', b:'B', a:'A'}; $H(table).keys().sort().each(function(key){ alert(key + ' ' + table[key]); }); </script> </body> </html> 他に良い方法ありましたら、教えてください。
- ベストアンサー
- JavaScript
- javascritp「sort」メソッドについて
WEB制作初心者、勉強中のものです。 javascritpのsortメソッドについて質問です。 無名関数を使って偶数と奇数を並び替えるコードについてですが、 下記の場合、function(a,b)の引数a,bには、一体どこの数値が入ってるのでしょうか。 var no=[1,2,3,・・・]の中だと思うのですが、、、、a,bが一体何を指すのが 教えていただけないでしょうか？ // 『sort』の引数として、使い捨ての関数を作成して利用する var no = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; // 配列作成 no.sort(function (a, b) { // 偶数を前に、奇数を後ろにソートする if (a % 2 == 0 && b % 2 != 0) return -1; if (a % 2 != 0 && b % 2 == 0) return 1; return 0; }); alert(no); // 『2, 4, 6, 8, 10, 1, 3, 5, 7, 9』と表示 よろしくお願い致します。
- ベストアンサー
- JavaScript
- 配列の日付ソート処理2
先ほど下記のような質問をしたのですが、、、 最初の配列の添え字を取得したい場合はどのようにしたらいいのでしょうか？？ ksort($up_date, "cmp"); while (list ($key, $value) = each ($up_date)) { echo "$key: $value\n"; } function cmp ($a, $b) { if ($a == $b) return 0; return ($a > $b) ? -1 : 1; } としても、日付がうまく昇順されません。 この方法では駄目なのでしょうか？？ ******************************************* 配列に下記のような日付が入ってます。 $array[0]=2004-11-01 14:20:10.412761+09; $array[1]=2004-11-28 19:09:42.898169+09; $array[2]=2004-11-26 17:16:10.531744+09; $array[3]=2004-11-30 20:25:39.622259+09; これをもっとも新しい日付の順序にしたいのですが、 これはやはり、バブルソートなどを作成する必要がでてきますでしょうか？？？ *********************************************
- ベストアンサー
- PHP
- JavaScriptのGPSについて
現在地の名前を入力し、GoogleMapで表示してその地図を保存するというものを作ったのですが 以下のコードで現在地を取得するとなぜかiPhoneでもAndroidでもバルセロナが表示されます なぜなのでしょうか？ 開発環境はMonacaです <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no"> <script src="components/loader.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="css/style.css"> <script> </script> </head> <body> <h1>ブックマークMAP</h1> <div id="new_div"> 店名：<input id="name_txt" type="text" value="" size="20" /><br /> <input id="save_btn" type="button" value="記録" /> </div> <div id="list_div">なし</div> <script> function $(id) { return document.getElementById(id); } //初期処理 var items = []; window.onload = function() { if (window.localStorage == undefined && navigator.geolocation == undefined) { alert("HTML5未対応端末です"); return; } //既存リスト表示 var list = localStorage.getItem("shoplist"); if (list == null) { list = ""; }else{ items = list.split("\n"); showItems(); } //記録ボタンを押したときの設定 $("save_btn").onclick = save_btn_clickHandler; }; //ブックマーク一覧の表示 function showItems() { var map_url = "http://maps.google.co.jp/maps?q="; var html = "<ul>"; for (var i in items) { var data = items[i].split("\n"); var name = data[0]; var lat = data[1] var lon = data[2] var link = "<a href='"+map_url+lat+","+lon+"'>"+name+"</a>"; html += "<li>"+link+"</li>"; } html += "</ul>"; $("list_div").innerHTML = html; } //保存ボタンを押したときの設定 function save_btn_clickHandler() { if ($("name_txt").value == "") { alert("場所を入力してください"); return; } //位置情報の取得 navigator.geolocation.getCurrentPosition( successCallback, errorCallback); $("save_btn").value = "現在地取得中" } //成功したとき function successCallback(position) { var lat = position.coords.latitude; var lon = position.coords.longitude; var name_txt = $("name_txt"); //場所+位置情報を保存 var item = name_txt.value + "/t" + lat + "/t" + lon; items.push(item); var list = items.join("\n"); try { localStorage.removeItem("shoplist"); localStorage.setItem("shoplist", list); } catch (err) { alert("保存失敗"); } $("save_btn").value = "記録"; name_txt.value = ""; showItems(); } //失敗したとき function errorCallback(err) { alert("失敗("+err.code+")"+err.message); $("save_btn").value = "記録"; } </script> </body> </html>
- ベストアンサー
- JavaScript
- JavaScriptで複数のCSVを取得しひとつのCSVごとに１つのs
JavaScriptで複数のCSVを取得しひとつのCSVごとに１つのselectフォームを表示しようとしております。 以下のようなJSを使っているのですが、aryCsvNameの配列にはいっている名前で複数のCSVを呼び込みたいのですが、 getElementById("select***").のところで、うまく***の箇所に配列の値をもっていけません。 aryCsvNameの値と***があえば、それぞれの<div>に表示されるのではないかとは思っているのですが、 それも予想です。 恐れ入りますが、どなたかいい方法をご教授ください。 function loadCSV() { aryCsvName = ["1","2","5","10"]; for (var j = 0; j < aryCsvName.length; j++) { var path = './data/'+aryCsvName[j]+'.csv'; var httpObj = createXMLHttpRequest(handleResult); if (httpObj) { httpObj.open("GET", path, true); httpObj.send(null); } } } function handleResult() { if ((this.readyState == 4) && (this.status == 200)) { var text = getAjaxFilter()(this.responseText); csvData = parseCSV(text); ///ここが不明 //document.getElementById("select***").innerHTML = result; //ここまで } } function parseCSV(str) { var CR = String.fromCharCode(13); var LF = String.fromCharCode(10); var lines = str.split(LF); var csvData = new Array(); for (var i = 0; i < lines.length; i++) { var cells = lines[i].split(","); if( cells.length != 1 ) csvData.push(cells); } return csvData; } function createXMLHttpRequest(cbFunc) { var XMLhttpObject = null; try { XMLhttpObject = new XMLHttpRequest(); } catch(e) { try { XMLhttpObject = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { try { XMLhttpObject = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { return null; } } } if (XMLhttpObject) XMLhttpObject.onreadystatechange = cbFunc; return XMLhttpObject; } function getAjaxFilter() { if (navigator.appVersion.indexOf("KHTML") > -1) { return function(t) { var esc = escape(t); return (esc.indexOf("%u") < 0 && esc.indexOf("%") > -1) ? decodeURIComponent(esc) : t } } else { return function(t) { return t } } } HTML部分 <div id="select1"></div> <div id="select2"></div> <div id="select5"></div> <div id="select10"></div>
- ベストアンサー
- JavaScript
- クイックソートについて
クイックソートのプログラムなんですが、 セグメンテーション違反で実行出来ません。 どこがおかしいのでしょうか？ int main(void) { FILE *fp; int a[10],b=0,n; clock_t start; double jikan; if( (fp = fopen ("quicksort.txt","r") ) == NULL ) { printf("ファイルが見つかりません : quicksort.txt\n"); exit(1); } while( fscanf(fp, "%d", &a[b]) != EOF ) { b++; } start = clock(); quick_sort(a,n); jikan = clock() - start; for(n = 0; n < b ; ++n) { printf("%d ",a[n]); } printf("計算時間 %.3f 秒 \n", jikan/CLOCKS_PER_SEC); return 0; } int partition(int a[], int l, int r) { int i,j,pivot,t; i = l-1; j = r; pivot = a[r]; for(;;) { while( a[++i] < pivot ) ; while( i < --j && pivot < a[j] ) ; if( i >= j ) break; t=a[i]; a[i]=a[j]; a[j]=t; } t=a[i]; a[i]=a[r];a[r]=t; return i; } void quick_sort_1(int a[],int l,int r) { int v; if( l >= r ) return; v = partition( a, l, r); if( l < v-1 ) quick_sort_1( a, l, v-1); if( v+1 < r ) quick_sort_1( a, v+1, r); } void quick_sort(int a[],int n) { quick_sort_1( a, 0, n-1); }
- ベストアンサー
- C・C++・C#
- 関数で定義した配列のソート
お世話になります。 配列のソートは xx = new Array(3, 7, 8, 1); xx.sort(); document.write('xx='+xx+'<br>'); function hikaku(a, b) { return(b - a); } yy = new Array(3, 7, 8, 1); yy.sort(hikaku); document.write('yy='+yy+'<br>'); で、できました。 ここで、 function aitem(name,value,date){ this.name=name; this.value=value; this.date=date; } var goods=new Array( new aitem('b',500,'06/05/01'), new aitem('a',200,'06/07/01'), new aitem('d',800,'06/06/01'), new aitem('c',300,'05/09/01'), ); と、配列goodsを定義します。 そして、例えばvalueで並び替えた配列を取得するなんてことはできないでしょうか。 よろしくお願いします。
- ベストアンサー
- JavaScript
お礼
yambejpさん ご回答ありがとうございました。 期待した結果が得られました。