常連

クリップコレクター

注目の的

社会貢献

質問力

質問者

模範生

自己紹介

有名人

**Railsでよくarr.map(&:to_s)というのを見るのですがなぜこのようになるかわかりません。**

mapやto_sはわかるのですが「&:」の部分がわかりません。

分かる方は、どなたか教えていただけますか。宜しくお願いします。

Railsでよくみる arr.map(&:to_s)の意味を教えてください

以下のjavascript関数について良いパターンを教えてください。

関数では、ユーザ操作等のイベントに応じて、インスタンス内のメソッドでdataを更新し、表示を切り替えようとしています。
data及び表示の管理をインスタンスのみにさせ、ユーザ操作等のイベントをインスタンスに対して伝える仕様にできれば綺麗かと考えているのですが、
実際には下記はthisの仕様によりエラーとなります。
（ユーザ操作等のイベントの場合イベント発生元がthisになるので）

単にエラーを回避して動かすことはできるのですが、
出来るだけ良いプログラム構造としたいです。

※クラス・インスタンスは複数種類存在します（SampleClassA、SampleClassB…、sampleA1、sampleA2、sampleB1...）

```javascript
//呼び出し側の記載///////////
var sampleA1 = new SampleClassA();
//初期イベント
sampleA1.initialEvent();
//windowサイズ変更時のイベント等
$(window).on('resize', sampleA1.resizeEvent)


//SampleClassA///////////
function SampleClassA() {
    this.data;
    this.object;
}
SampleClass.prototype = {
    setDefaultData: function() {
        this.data = {
            pointA: 10,
            pointB: 10,
            pointC: 10,
            pointD: 10,
        };
        return true;
    },
    doDisplay: function() {
        this.object = new SampleLibrary.display(this.data);
        return true;
    },
    initialEvent: function() {
        this.setDefaultData;
        this.doDisplay;
        return true;
    },
    updateResizeData: function() {
        this.data.pointA = this.data.pointA++;
        this.data.pointC = this.data.pointC++;
        return true;
    },
    resizeEvent: function() {
        this.updateResizeData; //エラー！！！
        this.doDisplay;
        return true;
    },
}
```

javascriptのプログラム構造について

タイトル通り、フレームワークのフォームヘルパーを使うメリットがよくわからないです。
使ってもそこまで短くなるわけでもないですし、可読性が良くなるとも言えません。
また、フレームワークの機能を使うのでHTML直書きよりは幾分か動作に時間がかかるはずです。

それなのにフォームヘルパーが使われるのはなぜでしょうか。

フォームヘルパーを使うメリットがよくわからないです。

###前提・実現したいこと
jQueryを用いて楽天ブックスAPIを導入した検索サイトを作成しています。
キーワードを入力し、検索ボタンを押して返ってきたデータを確認しようとしたのですが、うまくデータが返ってきていない状態です。

###発生している問題・エラーメッセージ
jQueryコードの関数getItemにおけるconsole.logにてデータの確認を行うと、undefinedと表示される。

###ソースコード
```HTML
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>api test</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="wrap">
        <div class="container">
            <div class="header">
                <p class="header__title">Search Books!</p>
            </div>
            <div class="search">
                <div class="search__text">
                    <input type="text" id="js-search-word" class="search__text__input" name="keyword" value="" placeholder="検索する">
                </div>
                <button id="js-search-button" class="search__btn">検索する</button>
            </div>
            <ul class="lists">
                
            </ul>
        </div>
    </div>
    <script src="js/jquery.js"></script>
    <script type="text/javascript">
       // ここに以下のjQueryのコードが入ります。
    </script>
</body>
</html>
```

```jQuery
$(function(){
    $("#js-search-button").on("click", function(){
        $word = $("#js-search-word").val();

        ajaxSearch($word);
    });

    function ajaxSearch(word){
        $.ajax({
            type: 'get',
            url: 'https://app.rakuten.co.jp/services/api/BooksTotal/Search/20130522?',
            data: {
                applicationId: 'すでに習得済み',
                keyword: encodeURIComponent(word),
                format: 'json',
                hits: '20',
                page: '1'               
            }
        }).done(function(data){
            getItem();
        });
    }

    function getItem(data){
        console.log(data);
    }
});
```

###補足情報(言語/FW/ツール等のバージョンなど)
まだまだ初心者として勉強中のため、どの箇所に原因があり、うまくできていないのかよくわからない状態です。データをきちんと得るためのアドバイスをよろしくお願いします。