JavaScriptに関するお知らせ

SINCE2019
>
【JS】もうすぐ増税なのでJavaScriptの税込みの美しい求め方について-前編

【JS】もうすぐ増税なのでJavaScriptの税込みの美しい求め方について-前編


こんにちは!今日はJavaScriptで税込みとかの簡単な計算を美しく書こうって話です。

増税(8%→10%)

10月1日から消費税が上がります。

消費税 | 国税庁

増税に伴い私たちエンジニアを襲うのは、税込みを美しく計算できるかという一抹の不安です。本当かよ。

果たして、priceとtax、2つの数字から税込みを綺麗に計算できるのでしょうか...?

基本形

基本的にはこのような構成になるでしょう。

計算を行う関数addTaxと答えを入れる変数total、税率TAXを定義し、引数に税抜き価格priceをとります。

const TAX = //省略
const addTax = (price, tax) => //省略

const total = addTax(100, TAX)
console.log(total)// ???

模範解答?

模範的な回答を示します。

const TAX = 10
const addTax = (price, tax) => price * (1 + tax / 100)

const total = addTax(100, TAX)
console.log(total) // 110

素晴らしい回答です。ですが、ですがまだまだ改善の余地があります。個人的には2箇所変えたい。

いや別にこれでいいんだけど...いいんだけどな!

計算がなんか嫌だ

税込みを求めるこのコード...

price * (1 + tax / 100)

税率の求め方をする時によく出てくる計算です。なんなら小学生の算数にも出てくる。

でも、正直この計算...あんまり好きじゃないです。小学生の頃から思ってました。

理由はいくつかあるんですが、

  • taxが0だったら動くのか一瞬迷う。頭の片隅に 0除算がよぎる(実際は問題なく計算できるし0除算じゃないです)。
  • 0/100は想像しにくい。0個のケーキを100人で分ける、みたいになっちゃって現実でイメージしにくい。
  • 少数でかける(割る)のもやっぱり現実でイメージしにくい。「1.1匹の猫が...」

というわけで、計算はこうするのが個人的におすすめ:)

これ小学生の頃から思ってたんですが、15年越しに記憶が復活しました。

;(price / 100) * (100 + tax)

これの何がいいって、

  • taxが0になっても大丈夫なことがすぐに分かる!足してるだけだし。
  • 少数で割ってもかけてもいない。

あと、一番お気に入りなのが

  • 計算式にストーリーがある。「100%の値段」を一旦100で割って「1%ぶんの値段」を出した後に、「1%ぶんの小さな値段が100+10(=110)個集まって結果的に110%になる」って感じ。素敵。ストーリーを作れってジョブズも言ってた。

こうするといいと思います。

const TAX = 10
const addTax = (price, tax) => (price / 100) * (100 + tax)

const total = addTax(100, TAX)
console.log(total) // 110

余談

ちなみにこれでもok

price + (price * tax) / 100

これは「税抜き価格+消費税分」みたいな発想ですね!かっこを使わないのでこの方が分かりやすいって人はいるかも。

後半へ続く

思ったより長くなったので分割いたす。次は引数の記述についてです!さらば

【追記】(2019/05/16)続き書いたよ!



PREV
2019-05-11
【HTML+CSS】iPhoneだと画面外が見えるぞ気をつけろ+解決方法

NEXT
2019-05-16
【JS】もうすぐ増税なのでJavaScriptの税込みの美しい求め方について-後編