ニッポンの数字ブログ

統計情報のポータルサイト「ニッポンの数字」の開発日記。

JavaScriptを通じてわかった文字の型の重要性

JavaScriptに限らず、プログラミングをやっていると、このデータは数字なのか文字なのかと必ず意識する。ようやく自分のやりたいことをプログラミングで表現できるようになり、「データの型」の重要さを痛感するようになった。

自分はプログラミング初心者なので、これがプログラミングの王道なのか定かではないが、プログラミングをしていると、とにかく変数を多く使う。変数というのは、数学の文字式に出てくる「x」や「y」のことだ。

この変数に入っているデータが文字型なのか数字型なのかがとっても大切。なぜなら、文字型にしか適用されない関数、あるいは数字型にしか適用されない関数があるからだ。これはエクセルにも言えることなので、エクセルで関数を使いこなせる人には馴染みがあることだと思う。

プログラミングをしていると、「ちゃんとコードを書いたのに動かない」といったことがしょっちゅうある。そこでGoogle Chromeのデベロッパーツールでコードにエラーがないか確認し、その原因が数値として処理していたデータが文字列だったということもめちゃくちゃある。

HTMLの数字を変数に代入しても、それは数字ではなく文字列として認識される。だから、console.logで確認すると、"1234"のように、ダブルクオーテーションで数字が囲まれているはずだ。

見た目は数字では、データの型が文字列なので、これでは足し算も引き算もできない。数字として認識するためには、Numberオブジェクトで「Number(1234)」と囲う必要がある。

自分の場合、JavaScriptにおけるプログラミングのエラーは、半分以上がデータの型についてだ。「動かない…(泣)」という事態に陥ったら、データの型を確かめてみるといいかもしれない。灯台下暗しで、案外上級者でも見落としていることがあるかも

JavaScriptとの格闘。変数、ループをやっと理解

ニッポンの数字を作成するに当たって、いろんなコードを見よう見まねで試して、何とかサイトを動かすようにできたのだけど、JavaScriptはコンテンツのタブ表示など、最低限の機能にとどめていた。

とどめていたゆうか、それしかできなかった。文法とかは理解できるのだけど、functionとか、()とか、{}とか、$とか、varとか、プログラミング独特の記号や文字がとっつきにくく、これが理解の妨げとなっていた。

コードを書いて書いてようやく書き終わって、いざブラウザで開くとレイアウトが壊れていたり、該当場所が余白になっている。そして、コードを書いた以上の時間を割いてエラーの原因を探して、見つからなくて、ストレスになって、酒を飲む。

翌日またエラー探しをしていると、セミコロンが一箇所欠けていただけだった…。

サイト制作当初はそんな状態だったから、JavaScriptを使いこなすのにはまだまだ時間がかかるんだろうなと思っていた。

そんな状態からサイト制作に取り組んで約1年経ち、いい加減プログラミングで効率化できそうなところをJavaScriptで実装してみたら、意外にも作業が進む。

取り組む前に、これまで何度もお世話になった西畑一馬氏の「jQueryデザイン入門」を読み返したのだけど、発見がたくさんあった。初めて読んだときはjQueryとは何ぞやを理解するだけで大変だったんだろう。

今読んでみたら「このセレクタを使えばあれができるな」とか、いろいろと気づけるようになっていた。本を読んで勉強するのもいいけど、合わせて実践しないと理解が深まらないんだな。

プログラミングを勉強したら、変数とかループという用語が出てくるのだけど、こいつらの役どころも理解できた。ニッポンの数字もようやくサイトっぽくなってきた。

サイト制作の初心者から初級者くらいになったかな。

JavaScript グラフ作成の簡略化に向けてはじめの一歩

統計情報を分かりやすくきれいに表示するため、JavaScriptを取り入れているのだけど、これまでHTMLで作る表組み用のデータとJavaScript用のデータを別々に書いていた。同じデータなのに別々に入力するため作業は2倍。入力ミスの確率も上がるので、どうにかHTML上のデータを流用できないかと思っていた。

サイトの更新作業に慣れてきたので、今のままでもいいのだけど、企業の決算が集中するとさすがに気分が滅入る。3月期末の決算発表が5月にあるから、それまでには何とかしたいと思い、ようやくJavaScriptをいじる決心をした。

グラフ以外にもJavaScript/jQueryを使っているので、基本的な部分は理解しているのだけど、ほとんどは本やWEBサイトに書かれたものを参考にしたもの。自分がやりたいと思っていることをコードで表現するのはほとんど初めてだ。

やりたいことはtableにあるデータを、Google chart に読み込むこと。WEBエンジニアの人にも至極簡単なことなんだろうけど、ちょっとホームページを作れるくらいの人間には大仕事なんだよね。

findメソッドとtextメソッドを使って、tbodyの中のtdデータを取得し、それを空の配列が入っている変数にぶち込む。うまくいったと思ったら、取得したデータが「2%」など、「%」が入ってしまっていた。

単位はいらないんだよ。でも、こうした問題は数々のプログラマーが直面してきたはず。だったら既に解決策はあるだろう。ということで、配列の中の要素をいじれる方法を探してみる。

すると手元にあるオライリー・ジャパンの「JavaScript」から、parseFloatという関数を発見。これは先頭にある数値のみを小数点付きで取り出してくれるメソッド。何とマニアックで何とタイムリーな。ありがたく頂戴して無事解決。

これでようやくはじめの一歩。

給料が上がらないのは正社員が増えないから

人手不足という言葉をニュースで聞くことが少なくない中で、給料はほとんど上がらない。人手不足というのなら、給料を高くして人を集めやすくする、もしくは既存の従業員が辞めないように給料を上げるべきだと思うが、こうした現象は限定的のようだ。

都市部のコンビニやファストフード店の入り口に貼っている求人広告をみると、アルバイトの時給は一時期よりも確実に上がっている。でも、ほとんどのサラリーマンの給料は上がっていない。なぜか。

就業者数の推移を作成して、その理由が分かったような気がする。従業員に占める正社員の比率が下がり続けているのだ。

1990年代まで80%前後だった正社員比率は、現在(2016年)62.5%。グラフを見ると分かるのだけど、正社員数が緩やかに減少して、非正規が急増しているためだ。

バブル崩壊以降、正社員が減った分を非正規で補填し、さらに従業員を増やすときは非正規の採用を優先している傾向がある。

企業としては、人件費はできるだけ安いほうがいいので、人手不足を非正規で解消できるのならそれに越したことはない。これまでの間、この安易な企業の考えが簡単に実現できるほど景気が悪かったということだ。

景気が悪いときだけではなく、景気回復期に非正規が増加するのも仕方がない現象だ。少し景気が良くなったからといって、それが長続きするとは限らない。半信半疑の状態では長期雇用を前提とする正社員は雇いづらく、まずは非正規で様子を見ようという心理が働くだろう。

就業者数の推移をみると、この様子見の状態が、2013年から現在まで続いている。失業率は2016年に3%台前半まで改善したが、改善に貢献しているのは非正規社員の増加だ。

雇用環境がさらに改善すると、この間採用された非正規社員の一部が正社員になるだろう。企業が新規求人を出す際も、正社員雇用の条件が増えるはずだ。ここまでいったら、多くのサラリーマンの人たちが給料が上がったと実感できるに違いない。

メールフォームを作成。結局エックスサーバーが用意したCGIに落ち着く。

ニッポンの数字を開設して半年。ずっと問い合わせ先を作成しようと思っていたんだけど、ようやく設置することができた。

作成するにあたってまず頭に浮かんだのはスパム対策。受信メールが迷惑メールだらけになったら、ちゃんとしたメールが埋もれてしまう。

スパム対策をどう施そうかと調べたらいろいろ出てくる。いろいろ調べた結果、キーワードになりそうなのが「CGI」だった。CGIっていう用語は聞いたことがあったけど、どういう意味かは不明。

でもそんなことはどうでもいい。とにかく気持ちが熱いときにメールフォームを作成するのだ。用語の意味など開発しながら自然とわかってくるし、そっちのほうが身になる。

それで「メールフォーム」「CGI」で検索すると、メールフォームの開発ツールをフリーで提供しているページを発見。

シンクグラフィカさんが提供しているツールが自分に合いそうだったので、シンクグラフィカさんのサイトからダウンロード。

マニュアルを読み進めていたら、どうやらCGIはサーバサイドで働いてくれるものらしい。それで自分が使っているエックスサーバーでも使えるのか調べてみた。使える。

よし、と思ったら、エックスサーバーのサービスにメールフォームが標準装備されているのに気づいた。自分のサイトにメールフォームのリンクを作成しておけば、あとはエックスサーバーが用意してくれたものをそのまま使えばいいのだ。

メールフォームを作成するのに丸2日間勉強したけど、行き着いた先はHTMLファイルにリンクを設置する作業1つだった。

徒労感。スパム対策とかメールフォームのデザインとかもうどうでもよくなる。エックスサーバーさんが提供しているんだからスパム対策はしてくれているでしょと期待し、各ページのフッターに問い合わせリンクを設置した。

ただ、リンクのデザインにウェブフォントを使ったのだけど、アンドロイドでの表示がなぜか歪んでしまう。でもいいや。疲れた…。