javascriptで配列の比較

前提・実現したいこと

前提
現在以下に記述しているコードで特定のアプリの全レコードを取得している。

実現したい
同じタイミングで二つのアプリのレコードを取得、比較し同じ値のフィールドを取得したい。

該当のソースコード

javascript
1(function() {
2    "use strict";
3
4    // レコード一覧画面
5    kintone.events.on('app.record.index.show', function(event) {
6        var manager = new KintoneRecordManager;
7        manager.appId = ; // 他のアプリID
8        manager.getRecords(function(records) {
9             // レコード取得後の処理
10             console.log(records);
11             console.log(records[records.length-1])
12    });
13
14    return event;
15});
16
17    /**
18     * kintoneと通信を行うクラス
19     */
20    var KintoneRecordManager = (function() {
21        KintoneRecordManager.prototype.records = [];    // 取得したレコード
22        KintoneRecordManager.prototype.appId = null;    // アプリID
23        KintoneRecordManager.prototype.query = '';      // 検索クエリ
24        KintoneRecordManager.prototype.limit = 100;     // 一回あたりの最大取得件数
25        KintoneRecordManager.prototype.offset = 0;      // オフセット
26
27        function KintoneRecordManager() {
28            this.appId = kintone.app.getId();
29            this.records = [];
30        }
31
32        // すべてのレコード取得する
33        KintoneRecordManager.prototype.getRecords = function(callback) {
34            kintone.api(
35                kintone.api.url('/k/v1/records', true),
36                'GET',
37                {
38                    app: this.appId,
39                    query: this.query + (' limit ' + this.limit + ' offset ' + this.offset)
40                },
41                (function(_this) {
42                    return function(res) {
43                        var len;
44                        Array.prototype.push.apply(_this.records, res.records);
45                        len = res.records.length;
46                        _this.offset += len;
47                        if (len < _this.limit) { // まだレコードがあるか？
48                            _this.ready = true;
49                            if (callback !== null) {
50                                callback(_this.records); // レコード取得後のcallback
51                            }
52                        } else {
53                            _this.getRecords(callback); // 自分自身をコール
54                        }
55                    };
56                })(this)
57            );
58        };
59        return KintoneRecordManager;
60    })();
61})();
62

試したこと

プログラムに触れたことがなく、１つ１つ調べながらいじってきましたが、思うように動かないしどうしていいかもわからない状況。
上記のサンプルはkintone developer networkのサンプル
超初心者の私めにアドバイス頂ければ幸いです。
よろしくお願いいたします。

補足情報（FW/ツールのバージョンなど）

kintoneのプラグインJSEdit for kintoneを利用しています

yambejp

2018/12/17 07:59 編集

なるべく簡潔なサンプルを用意して、どういう場合にどうしたいかを具体的に明示してください

行動規範の内容に同意します

回答1件

ベストアンサー

コードのどこで、どんな値を比較したいのか書いてないので回答のしようもないのですが、
JSのオブジェクト同士の比較の周りはちと特殊なので多分それじゃないかなと思います。

取得した二つのレコードを比較し、同じ値のあるレコードを表示したい。

まずはこのコードを見て下さい

JavaScript
1// なんと、同じ型で同じ値が入ってるのに、falseになる
2console.log({name: "taro"} === {name: "taro"}); // false
3console.log([1, 2, 3] === [1, 2, 3]); // false
4
5// でも、こうすれば何故かtrueになる
6var obj = {name: "taro"};
7console.log(obj === obj); // true
8
9var arr = [1, 2, 3];
10console.log(arr === arr); // true
11
12// こうなるとやっぱりfalseになる
13console.log(obj === {name: "taro"}); // false
14console.log(arr === [1, 2, 3]); //false

解説！
JavaScriptではオブジェクトや配列を作った時、
メモリ空間上にオブジェクトや配列の実体を生成します。
オブジェクトや配列を比較演算子(===)で比較した場合、メモリ空間に存在するアドレス値で同じものか否かを判定する仕組みになっています。

(因みにString、Number、Boolean等のプリミティブ値は===で比較出来ます)

なので{name: "taro"} === {name: "taro"}等と書いた場合、
メモリ空間上に{name: "taro"}というオブジェクトを２個生成し、そのアドレス値同士を比較する為falseになります。
変数obj等に代入するとobjにはアドレス値が代入され、obj === objの結果がtrueになります。

kintoneから持ってきたレコード情報がどう作られているか分かりませんが、
恐らくはJSONからJSON.parseかなんかを使って作られたオブジェクトの配列でしょうから、
一見同じ値が詰まっているレコード同士を比較してもfalseになってすり抜けてしまうはずです。

ではどうすればいいか？

例えば全てのレコードが一意なID値を持っていれば話が早いですね。

JavaScript
1var record1 = {id: 100, name: "taro", age: 20};
2var record2 = {id: 100, name: "taro", age: 20};
3
4// 直接比較すると当然falseになるけど
5console.log(record1 === record2); // false
6
7// ID値同士で比較すればNumber型同士だからtrueになる
8console.log(record1.id === record2.id); // true
9
10// こんな関数作ってやればスマートに書ける
11var isEqual = function (a, b) {
12  return a.id === b.id;
13}
14console.log(isEqual(record1, record2)); // true
15
16// もちろんID値が同じ偽物データが来たらtrueになるので注意
17var record3 = {id: 100, name: "jiro", age: 18};
18console.log(isEqual(record1, record3)); // true

問題は全てのキーを判定する必要があるケースです。
Object.keysなどを使ってそれを起点に判別するようなやり方になるでしょう。
完全ではないですが、それの一例

JavaScript
1var isEqual = function (a, b) {
2  var aKeys = Object.keys(a);
3  var bKeys = Object.keys(b);
4  // bのプロパティがaよりも多い上位互換の可能性を潰す
5  if (aKeys.length !== bKeys.length) return false;
6  for (var i = 0; i < aKeys.length; i++) {
7    var key = aKeys[i];
8    if (a[key] !== b[key]) return false;
9  }
10  return true;
11}
12
13var record1 = {id: 100, name: "taro", age: 20};
14var record2 = {id: 100, name: "taro", age: 20};
15var record3 = {id: 100, name: "jiro", age: 20}; // ニセデータ
16console.log(isEqual(record1, record2)); // true
17console.log(isEqual(record1, record3)); // false

だいたいこんな感じになるでしょう。
上記のコードは{id: 1, items: ["財布", "カバン"]}みたいに更に配列やオブジェクトのプロパティを持っているようなケースや、日付情報(DateTime型)等で誤動作するでしょうから、ライブラリの既成品を使った方が良いでしょう。

Lodashという値を操作するのに特化したライブラリがあり、
isEqualという機能を使うのが良いでしょう。

投稿2018/12/17 09:23

miyabi-sun

総合スコア21158

shitucyou

2018/12/17 09:49

曖昧な質問から私の質問の意図を理解し細かい説明をしてくださってありがとうございます。取得した値はこんな感じになります(一部分抜粋) Aアプリ (297) […] [0…99] 0: {…} "$id": Object { type: "__ID__", value: "1" } "$revision": Object { type: "__REVISION__", value: "1" } abc: Object { type: "SINGLE_LINE_TEXT", value: "abcde" } myname: Object { type: "SINGLE_LINE_TEXT", value: "" } def: Object { type: "SINGLE_LINE_TEXT", value: "" } "レコード番号": Object { type: "RECORD_NUMBER", value: "1" } "作成日時": Object { type: "CREATED_TIME", value: "2018-10-01T06:17:00Z" } "作成者": Object { type: "CREATOR", value: {…} } "日付": Object { type: "DATE", value: null } "時刻": Object { type: "TIME", value: null } "時間": Object { type: "SINGLE_LINE_TEXT", value: "" } "更新日時": Object { type: "UPDATED_TIME", value: "2018-10-01T06:17:00Z" } "更新者": {…} Bアプリ (7) […] 0: {…} "$id": Object { type: "__ID__", value: "8" } "$revision": Object { type: "__REVISION__", value: "2" } ***: Object { type: "SINGLE_LINE_TEXT", value: "***" } abc: Object { type: "SINGLE_LINE_TEXT", value: "abcde" } ***: Object { type: "SINGLE_LINE_TEXT", value: "***" } ***: Object { type: "SINGLE_LINE_TEXT", value: "*******" } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "***": Object { type: "MULTI_LINE_TEXT", value: "" } "***": Object { type: "SINGLE_LINE_TEXT", value: "***" } "***": Object { type: "CHECK_BOX", value: [] } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "ドロップダウン": Object { type: "DROP_DOWN", value: null } "ドロップダウン_0": Object { type: "DROP_DOWN", value: null } "ドロップダウン_1": Object { type: "DROP_DOWN", value: null } "ドロップダウン_2": Object { type: "DROP_DOWN", value: null } "ドロップダウン_4": Object { type: "DROP_DOWN", value: null } "レコード番号": Object { type: "RECORD_NUMBER", value: "8" } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "***": Object { type: "CREATED_TIME", value: "***" } "***": Object { type: "CREATOR", value: {…} } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "***": Object { type: "DATE", value: "2018-11-16" } "***": Object { type: "CALC", value: "0.0082" } "***": Object { type: "DROP_DOWN", value: null } "***": Object { type: "UPDATED_TIME", value: "2018-11-22T05:04:00Z" } "***": Object { type: "MODIFIER", value: {…} } "***": Object { type: "DATE", value: "2018-11-16" } "***": Object { type: "DATE", value: "2018-11-13" } "***": Object { type: "SINGLE_LINE_TEXT", value: "***" } "***": Object { type: "DROP_DOWN", value: "***" } "***": Object { type: "DROP_DOWN", value: null } "***": Object { type: "DROP_DOWN", value: null } "***": Object { type: "DROP_DOWN", value: null } "***": Object { type: "SINGLE_LINE_TEXT", value: "123456" } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "***": Object { type: "SINGLE_LINE_TEXT", value: "" } "***": Object { type: "FILE", value: [] } <prototype>: Object { … } 1: Object { "続柄_1": {…}, "レコード番号": {…}, "": {…}, … } 2: Object { "続柄_1": {…}, "レコード番号": {…}, "": {…}, … } 3: Object { "続柄_1": {…}, "レコード番号": {…}, "": {…}, … } 4: Object { "続柄_1": {…}, "レコード番号": {…}, "": {…}, … } 5: Object { "続柄_1": {…}, "レコード番号": {…}, "": {…}, … } 6: Object { "続柄_1": {…}, "レコード番号": {…}, "": {…}, … } length: 7 この中からabcというフィールドの値abcdeを比較して探したいというものでした。

行動規範の内容に同意します