質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.35%

Javascriptの配列型

解決済

回答 5

投稿

  • 評価
  • クリップ 0
  • VIEW 1,223

SugiuraY

score 249

非常に単純な質問で申し訳ございません。
Javascript上、配列型の中に関数を入れることは誤った記法でしょうか。
①下記、なぜそのよう方法で配列に入れるのかは置いておいたとして、記法自体は誤りでしょうか?

var A= 5;
var B= 10;

var data =[document.write(A+","+B)];

②また、配列の中身を変数にしたい場合には(サーバーサイドから必要な情報を条件に合わせて代入する)はJacascriptの場合、通常どのように記載するものでしょうか?本当にまだまだ不案内なのですが、scriptタグ内にphpでSQL文を書くべきなのか、それともnode.js等で対応するのか基本的な点がまだわかりません。
*現在Chart.jsというものを使っているのですが、サーバーから情報を引っ張り、動的にグラフを作りたいのですが、javascriptが全くの初心者のため、どのように一般的に対応するのかがわかりません、、

低い水準の質問であることは重々承知をしておりますが
お力添えのほど、よろしくお願い申し上げます。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 5

checkベストアンサー

0

① 記法自体は誤りでしょうか?
→ 間違いではないです。

② 配列の中身を変数にするJavaScriptの記載方法
こんな感じでどうでしょう。

var func = function(C, D) {
  console.log(C+","+D)
}

var data =[func];

var A= 5;
var B= 10;
data[0](A, B);

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

0

var A= 5;
var B= 10;
var data = func;
data(A, B);

function func(a, b){
    document.write(a + "," + b);
}


とか。関数入れるとこはこんな感じでも

var data = function(a, b){
    document.write(a + "," + b);
};

WebページのJavaScriptにデータを渡す場合、
HTMLをサーバで生成する際に埋め込んでおく方法と
Ajaxで後からとってくる方法がありますかね。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/08 14:16

    上の例では、通常以下のように使います。
    func(A, B);
    ここで、dataに関数が入ってるので
    data(A, B);
    としても同じ意味になります。
    ついでに Olympic2020さんの例でいうと
    data[0](A, B);
    も同じ意味になります。(この場合は関数が配列に
    入ってるのでこういう書き方になるということです)
    自分の場合は、配列に入れたいわけじゃないのかなあ
    と解釈して、ああいう書き方としました。

    キャンセル

  • 2016/05/08 14:34

    非常にわかりやすいご記載を頂き有難うございます。
    本当に有難いです。改めて、
    深謝を申し上げます。

    キャンセル

0

ご回答頂き、誠に有難うございます。
ご記載頂いた
data(A,B)
とは、何を意味している文になりますでしょうか?

度々、恐れ入りますが
よろしくお願い申し上げます。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/08 14:12

    これは自分宛ですかね?
    自分の回答にコメントしときます。

    キャンセル

  • 2016/05/08 14:18

    あ、すみません、funcの引数部分に代入しているという事ですね。。
    失礼致しました。

    キャンセル

  • 2016/05/08 15:12

    失礼致しました。使い慣れておらず、申し訳ございません。

    キャンセル

0

①記法自体は誤りでしょうか?

エラーは出ませんが、関数を配列に入れているのではなく、document.write(A+","+B) の結果(画面に5,10が出力され、この関数は返り値が無いため undefined )が入ります。

関数を入れるのであれば下記のようにも書けます。

var c = 5, d = 10;
var data = [ function( a, b ){ document.write( a + ',' + b ) } ];
data[ 0 ]( c, d );    // 「5,10」がHTMLに出力される

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/08 14:51 編集

    ご回答頂き有難うございます。
    返り値は5,10になるのではないでしょうか?また、HTMLに5,10を出力したいというよりも、javascript上の配列に5,10を順番に格納したい《data[5,10]を作りたい》というところが目的なのですが、《従って、無理やり[]の中に、php的な感覚でdocument.writeを入れてみました》が如何でしょうか?
    宜しくお願い申し上げます。

    キャンセル

  • 2016/05/08 15:00

    document.write は 「document」に「write」する関数です。そのため、HTMLに出力する以外に返り値を持ちません。PHPでも var data = [ echo( 5, 10 ) ]; とは書かないと思います。
    配列 [5,10] を作りたければ、var data = [ 5, 10 ]; とすれば良いです。

    キャンセル

  • 2016/05/08 15:11

    ご回答頂き有難うございます。document.writeに関して大変、納得致しました。
    この5,10の数値がサーバーから条件により変化するために、この度[]の中に単純に数値を入れずに中に関数等を入れようと思った次第でございます。
    なので、直接数値型を入れない場合のやり方に奮闘をしておりました。

    キャンセル

  • 2016/05/08 15:20

    「PHPから出力するHTMLのJavaScriptに値を渡す方法」をお探しでしょうか。PHPの出力部分および「出力結果として欲しいHTML&JavaScript」を提示されれば、回答を得られやすいと思います。

    キャンセル

0

① , ② ともすでに回答がでてますが、
配列の中身を関数にするJavaScriptの記載方法
について、利用例を提示します。

問題:
  2つの数をあたえられたら、和、差、積、商を計算するとします。

解法:

  • その1
function calcs(a, b) {
  return[a + b, a - b, a * b, a / b];
}
console.log (calcs(10, 2));
  • その2
    配列に関数を入れるようにして、次のように書くこともできます。
function add(x, y) { return x + y; }
function sub(x, y) { return x - y; }
function mul(x, y) { return x * y; }
function div(x, y) { return x / y; }
function calcsX(ops, a, b) {
  return ops.map(function(elem) { return elem(a, b);});
  // map() がわからなければ、次のように書いても同じです。
  // var ans = [];
  // for (var i = 0; i < ops.length; i++) {
  //   ans.push (ops[i](a, b));
  // }
  // return ans;
}
console.log (calcsX([add, sub, mul, div], 10, 2));

計算結果の順番変更、計算方法の追加、削除をしたい場合、
1 番目の方法では、cakcs() の中身を書き換えるか必要があります。
2 番目の方法では、calcX() の呼び出す時の ops の配列を変更するだけで済みます。

変更例:
足し算と掛け算の結果だけを返すように変更する。

  • その1
function calcs2(a, b) {
  return[a + b, a * b];
}
console.log (calcs2(10, 2));
  • その2
console.log (calcsX([add, mul], 10, 2));

add(), mul()  を定義せず、直接 配列に関数を代入することもできます。

ops = [
  function(a,b) { return a + b;},
  function(a,b) { return a * b;}
];
console.log (calcsX(ops, 10, 2));

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/08 17:50 編集

    ご回答頂き有難うございます。
    その2は少し私も勉強はしてからでなければ、未だ分からない部分がございます。その1についてですが、returnのあとに[]で記述すること事で、このfunctionは、常に配列を返す様に働くことになるのでしょうか?
    どの部分が配列を返す仕組になっていれのかが、直感的に正直わかりません。
    return[]としているからこそ、console.logでもどのような関数でも、そのfunctionを呼び出し引数を指定すれば、配列をかえしてくれるという事になるのでしょうか?それとも、例えばconsole.logそのものに配列を返す機能がふくまれているのでしょうか。
    非常に分かりづらい文面で誠に申し訳ございませんが、何卒宜しくお願い申し上げます。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.35%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る