4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Javascriptパターン第3章まで読んで気になったことメモ

Last updated at Posted at 2019-09-17

Javascriptパターン ~ 第3章までで気になったことメモ

"use strict"; の存在

ほえぇそんなものがあったんですね...そしてstringを打ち込むだけなら前のversionだろうと問題なかろうし、うまいなぁと。
ES6ではどうなっているんかなぁと思った所ざっくり次のような感じっぽい。

  • Global: not strict

The meaning of some such directives is special. Currently, ES5 defines only one special directive — already mentioned a Use Strict Directive.

  var x;
  "use strict"; // <= NOT Directive Prologue
(function(){
  "hogera",// <= FROM Directive Prologue
  "piyo",
  "use strict";// <= TO Directive Prologue
})()

英語力が低すぎてES6のサイトから今の所特別なDirective Prologueはstrictしかないってのを読み取れないんだけども、どうなんだろう...
前のバージョンとかであったりしたのかな...

  • Module: strict
  • Class(ClassDeclaration or a ClassExpression): strict
  • eval: not strict
    • Use Strict Directiveで付け足し可能
  • Function: not strict
    • 関連するものにstrictなfunctonがあればそれに応じてstrictになる

すんごいざっくりすると多分こんな感じなんだと思う。理解が深くなくてあまり読めんかったが。
今度また読み直そう。

for loop

言っていることは大概理解できたんだけども、確かに頭いいなって思ったのは次のようなやつ

var a,
    arr = [];
// arrにpushやらなんやら

for(i = arr.length; i--;){
  // 処理
}
const arr = [];
let i = 0;
for (let index = 0; index < 10000; index++) {
    arr.push(index);
}

// Test1
const startTime1 = performance.now(); // 開始時間
for (i = arr.length; i--;) {
    // 処理(何もしない)
}
const endTime1 = performance.now(); // 終了時間
console.log(endTime1 - startTime1);

// Test2
const startTime2 = performance.now(); // 開始時間
for (i = 0, max = arr.length; i < max; i++) {
    // 処理(何もしない)
}
const endTime2 = performance.now(); // 終了時間
console.log(endTime2 - startTime2);

んで結果が
0.2800000074785203
0.31999999191612005
とりあえず差が出ることはわかった。やっぱ0比較は強いんだろうかねぇ。

parseInt, Number

今までずっとstring -> numberの時にparseIntを使っていたんだけれど、Number('numberStr')でもいけるらしい。
こっちの方が早いらしいので、さっきのをそれぞれparseInt, Numberの処理を入れてざっくり計測してみたけれど10万くらいになると確かに差が出てくる感じ。

プリミティブのラッパー

やったことなかったんだけど

var greet = "hello";
greet.smile = true; // <= エラーにならない
greet.slice(0,2); // <= エラーにならない
console.log(greet.smile); // <= undefined

sliceとかStringオブジェクトのメソッドを使うときは一旦オブジェクトとして再定義しているらしい。
けどgreet自体がオブジェクトになっているわけではないので、プロパティとか追加してもアクセスはできない。

ほへぇ。

素朴な疑問として、もし毎回stringがStringとしてのsliceやらなんやら使う度にオブジェクトを生成しているのだとしたら、速度としてStringの方でやったほうが早いんじゃないか..?と思うじゃないですか。

const arr = [];
for (let index = 0; index < 100000; index++) {
    arr.push(index.toString());
}
const longPriStr = arr.join("");
const longObjStr = new String(longPriStr);

let i = 0;
// Test1
const startTime1 = performance.now(); // 開始時間
for (i = arr.length; i--;) {
    longPriStr.slice(i, i + 1);
}
const endTime1 = performance.now(); // 終了時間

// Test2
i = 0;
const startTime2 = performance.now(); // 開始時間
for (i = arr.length; i--;) {
    longObjStr.slice(i, i + 1);
}
const endTime2 = performance.now(); // 終了時間
console.log(endTime1 - startTime1);
console.log(endTime2 - startTime2);

結果
3.175000019837171
13.64999997895211

めっちゃ遅い。謎。
何かしら別の処理でもなんでもしているのかなぁ...こちらも今度確認せねば。
今回は時間がないのでここまで。

4
3
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?