Firefox備え付け開発ツールのコンソールの仕様？に違和感が……

ちょっと確かめたいことがあって下のようなコードを書いておりました。

var arrayA = ['iruka', 'gorira', 'ringo'];
var arrayB = [];

console.log('arrayAの中身',arrayA);
console.log('arrayBの中身',arrayB);

var tmp = arrayA.pop();
console.log('tmpの中身',tmp);

used.push(tmp);
console.log('arrayAの中身',arrayA);
console.log('arrayBの中身',arrayB);

Firefoxの開発ツールのコンソールで実行結果を確認したところ

Firefoxでの表示結果

arrayAの中身 ['iruka', 'gorira']
arrayBの中身 ['ringo']
tmpの中身 'ringo'
arrayAの中身 ['iruka', 'gorira']
arrayBの中身 ['ringo']

と表示され、『あれ？popする前に既にない、pushする前からarrayBに何かはいってるぞ……』想定したのと違ったので軽く混乱しました。
コードを何度も見直し自分が間違っているのではなくて表示の問題なのではないかとgoogle調べてみると同じような記事を書いてらっしゃる方がいました。
Firebug と Firefox で「console.log」の仕様が違って不便な件 知らなきゃ絶対損するPCマル秘ワザ

どうやらFirefoxはそのオブジェクトの最終的な状態をコンソールに表示しちゃうみたいです。これ僕が求めている結果はfirebugの方なのでこれからはこっちを使おうかな。

firebugでの表示結果

arrayAの中身 ['iruka', 'gorira', 'ringo']
arrayBの中身 []
tmpの中身 'ringo'
arrayAの中身 ['iruka', 'gorira']
arrayBの中身 ['ringo']

Firefoxでの開発ツールの表示は何か意味があるのかな。知識不足でわかりません。

【jQuery】append()とprepend()の動作

<input id="addList" type="button" value="挿入テスト" />

<table>
	<div id="roomList"></div>
	<tr><td>a</td><td>b</td></tr>
	<tr><td>e</td><td>f</td></tr>
</table>

このテーブルにprependとappendでそれぞれ挿入してみる

var counter
$("#addList").click(function(){
　　　$("#List").prepend("<tr><td>" + counter + "</td><td>" + counter+ "</td></tr>");
　　　//$("#List").append("<tr><td>" + counter + "</td><td>" + counter+ "</td></tr>");
     counter++;
      });

『prependの場合』：あとの挿入ほど上へ

4 4
3 3
2 2
1 1
0 0
a b
e f

『appendの場合』：あとの挿入ほど下へ

0 0
1 1
2 2
3 3
4 4
a b
e f

【android】drawableなリソースを<shape>で定義する

ボタンなどビューの背景に簡単な図形(まる、しかくetc...)を適用したい場合、XMLによって画像を定義することができる。
どんな図形を定義できるか、設定できる値、項目などは公式ページで詳しくまとめられている。
http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape

以下のコードは公式ページからの引用

    <?xml version="1.0" encoding="utf-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape=["rectangle" | "oval" | "line" | "ring"] >
        <corners
            android:radius="integer"
            android:topLeftRadius="integer"
            android:topRightRadius="integer"
            android:bottomLeftRadius="integer"
            android:bottomRightRadius="integer" />
        <gradient
            android:angle="integer"
            android:centerX="integer"
            android:centerY="integer"
            android:centerColor="integer"
            android:endColor="color"
            android:gradientRadius="integer"
            android:startColor="color"
            android:type=["linear" | "radial" | "sweep"]
            android:useLevel=["true" | "false"] />
        <padding
            android:left="integer"
            android:top="integer"
            android:right="integer"
            android:bottom="integer" />
        <size
            android:width="integer"
            android:height="integer" />
        <solid
            android:color="color" />
        <stroke
            android:width="integer"
            android:color="color"
            android:dashWidth="integer"
            android:dashGap="integer" />　
    </shape>

• shape

親となる要素。ここで図形の種類を定義する。rectangle,oval,line,ringの4つから選べるようだ。

• courners

図形の角の丸みを調節できる。android:radius="integer"とすると全ての角。他は各角に対応している。line,oval,ringで指定するとどうなるか不明。(確認できしだい追記)

• gradient

グラデーションを指定する。書きにくいので割愛。

• padding

適用するビューとのpaddingを指定する。そのままのタグですね。

• size

図形の大きさを指定する。
普通は図形を適用するビューの大きさに合わさるので無視される。
ここを指定するのは図形をImageViewのように直接使いたい場合だけか。

• solid

図形の色を指定する。

• stroke

枠線を指定する。
android:width="integer"は線の太さ。colorは色。
android:dashWidth="integer"は点線の太さ。
android:dashGap="integer"は点線の間隔。

画像を必要としないのでサイズを減らすことができる。あと噂では画像よりも処理が速いだとか。
下記のサイトは実行画面と一緒にいろいろなサンプルを紹介されている。綺麗だ。
http://narazoro.hatenablog.com/entry/20110710/1310273042