めも。
■HTML
<div class="target piyo">hoge</div>
■Javascript
<script>
$(function(){
var c = $('.target').hasClass('piyo');
console.log(c);
// true
});
</script>
【jQuery】Classの存在チェックを行う。
【jQuery】Datepickerを日本語対応させる。
以前の記事←に加えて、下記のスクリプトを読み込むことで日本語化が可能。
<script src="jquery.ui.datepicker-ja.js"></script>
jQuery本体をダウンロードした際に同梱されている「i18n」というフォルダ内に各国のローカライズ用スクリプトが格納されているのでそこから持ってくる。
そして下記コードを記述
// 日本語化する場合 $.datepicker.setDefaults($.datepicker.regional['ja']); // デフォルトの言語に戻す場合 $.datepicker.setDefaults($.datepicker.regional['']);
特定のカレンダー対してだけローカライゼーションを行いたい場合は下記の通り。
$('selector').datepicker($.datepicker.regional['ja']);
【jQuery】指定した要素の中身を空にする。
めも。
remove()だとその要素ごと消し去ってしまうので、子要素のみを空っぽにしたい場合はempty()を用いる。
以下例。
■HTML
<div class="target">hogehogehogehogehogehoge<span>piyopiyopiyo</span></div>
■Javascript
$(function(){
$('.target').empty();
});
これで外側のdiv要素は残り中身だけを空にする事が出来る。
【jQuery】Ajaxの通信を中断させる方法。
めも。
例えば下記のように、Ajaxのスタートボタンとストップボタンを用意したとして。
<input type="button" value="Start" class="js_start"> <input type="button" value="Stop" class="js_stop">
下記のように$.ajax()の結果を変数に格納しておくことで、.abort()による通信の中断が行えるようになる。
<script>
$(function(){
var ajax;
$('.js_start').click(function(){
var url = '/api/url';
ajax = $.ajax({
url: url,
type: 'POST'
}).done(function(){
alert('success');
}).fail(function(){
alert('error');
});
});
$('.js_stop').click(function(){
ajax.abort();
})
});
</script>
これは便利。
【Javascript】暗黙の型変換でブーリアン型のfalseに置き換わる値まとめ。
if文やwhile文といった条件式で暗黙の型変換が行われる際、falseとして評価されるものは以下の通り。
・数値0
・数値NaN
・null値
・undefined値
・空白文字列”
上記以外の値は全てtrueとなる。
また、ブーリアン型への変換時にもイディオムが存在し「!」演算子を用いることで実現している。
!演算はブーリアン型のオペランドに対する論理否定演算なため、評価対象がブーリアン型でなければ、上記のルールに則り暗黙の型変換が行われる。
そのため!演算を二つ重ね!!とする事で否定の否定となり、最終的にブーリアン型への変換機能だけが残るのである。
> !1; false > !!1; true > !!'a'; true > !!'0'; true > !!0; false > !!''; false > !!null; false
といった具合。
またブーリアン型への型変換で注意すべきポイントとして、オブジェクト型の評価結果がある。
オブジェクト型をブーリアン型に変換すると必ずtureを返却するため、下記のようなコードであってもtrueが返却されるので注意されたし。
> var bool = new Boolean(false); !!bool; true
ここでいうboolはBooleanクラスのインスタンス（オブジェクト）であるため、変換結果はtrueとなる（中身はfalse）。
※厳密に言うとJSにクラスは存在しないが言語仕様上の破綻は起こらないため、便宜上クラスという文言を用いた。
【Javascript】型変換のイディオム。
めも。
最短表記。
// 数値から文字列値（文字列連結時の暗黙の型変換を利用） var num = 123; num+''; // 文字列値から数値（正の符号演算時の暗黙の型変換を利用） var str = '123'; +str;
String(123)、Number(‘123′)と記述すると可読性には優れるが、コードが冗長化するため個人的には好まない。
【Javascript】NaNに関するまとめ。
自分用。
NaNは如何なる演算を行ってもNaN以外に変化しない。よって処理中にNaNが一度でも現れれば最終結果は常にNaNとなる。
> NaN + 1; NaN > NaN * 0; NaN > NaN - NaN; NaN
NaNは他のどんな値とも同値にならない。またNaN同士の同地判定すら偽を返却する。
> NaN == 1; false > NaN === 1; false > NaN == NaN; false > NaN === NaN; false
下記の通り、比較演算子を用いた評価もすべて偽を返却する。
> NaN > 1; false > NaN <= 1; false > NaN < NaN; false > NaN >= NaN; false
NaNであることを判定したい場合はisNaN()関数を用いる。
> isNaN(NaN);
true
> isNaN({});
true
> isNaN(new Number(NaN));
true
おまけ。
NaNと併せ、特殊値扱いされている正の無限大、負の無限大も同時に判別したい場合はisFinite()関数を用いればよい。
isFinite()はNaN、及び正負の無限大以外の場合に真を返却する。
> isFinite(123); true > isFinite(NaN); false > isFinite(Infinity); false > isFinite(-Infinity); false
【Javascript】浮動小数点を扱う際の基本的な注意点。
明示的に浮動小数点を宣言する言語ではあたりまえの知識かもしれないけど、Javascriptを書いていて初めて知ったのでメモ。
※Javascriptはどのような数字でも常に浮動小数点として扱うので注意されたし。
// 0.1と0.2の和は0.3にならない > 0.1 + 0.2; 0.30000000000000004 // 当然下記の2パターンは一致しない > (0.1 + 0.2) == 0.3; false > (0.1 + 0.2) === 0.3 false // 下記も近似値 > 1/3; 0.3333333333333333 // 下記も近似値 > 10/3 - 3; 0.3333333333333335 // よって当然書きも一致しない > (10/3 - 3) == 1/3; false > (10/3 - 3) === 1/3; false
浮動小数点はそもそも小数点以下を正確に表現することができないらしい。正確に表現できる場合こそがむしろ例外的であり、ほとんどの数値は近似値で表現されているという点に注意されたし。