「ES6」カテゴリーアーカイブ
【JavaScript】Object.crateとassignを使ってnewしないでインスタンスを作る「FactoryFunction」
大変興味深い記事見つけました
ざっくり何をいっているかというと
「あなたがprototypeを理解していないならJavaScriptを理解していない」
衝撃的。。
classの継承はprototypeの継承と同じことですか？？スタイルの違いですか？？
No
classは青写真、設計図、subクラスとの関係。
いいかえるならclassがないとインスタンスは作れない
インスタンスメソッドはそれ自体class定義されていないと実行できない
まずインスタンスを作ってインスタンス上でメソッドを実行しなくてはならない。
prototype継承は
他のインスタンスから継承しているインスタンス。
prototype委譲して使っている。
インスタンスのprototypeを設定するとオブジェクトへの参照をもつ
オブジェクトは他のオブジェクトへのリンクをもつようになる。(concatenative inheritance 連接継承)
A class is a blueprint.
A prototype is an object instance.
Aren’t classes the right way to create objects in JavaScript?
クラスがオブジェクトを作る正しい方法なの？？
No
let animal = {
animalType : "brown",
discribe (){
console.log("fafa")
}
}
これにprototpeに委譲させるObject.createを使って。
let animal = {
animalType : "brown",
discribe (){
console.log("fafa")
}
}
let mouse = Object.assign(Object.create(animal), {animalType: 'mouse'});
mouse.discribe()
//fafa
//mouseに別オブジェクト内のdiscribeメソッドがprototype委譲されている
//animalは「delegate prototype」となる
mose.animalType
//mouse
//自身のpropertyとして持っているのでprototypeチェーンを辿らない
JS Bin on jsbin.com
Object.createは
このまえやりました。
「we could attach delegate prototypes without using constructors and the `new` keyword」
この場合animalをnewとconstructorなしに、prototype委譲できる
「Don’t you need a constructor function to specify object instantiation behavior and handle object initialization?」
細かい初期設定や振る舞いを書くコンストラクターは必要ないってこと？？
No
「Any function can create and return objects. When it’s not a constructor function, it’s called a factory function.」
どんな関数も作成、オブジェクトを返せる。それがコンストラクタではないとき、ファクトリー関数といわれる
JS Bin on jsbin.com
記事では
・privacy propertyのもち方
・new keywordが何をしているか
・instance of は嘘つきだ
・newはきもい！
・newを使うときとcreateではパフォーマンスに違いはあるのか
なども解説されています。
面白いし、英語記事から学ぶと英語とコードの勉強になって一石二鳥ですね。
でわまたーーー
【JavaScript】"true"や"false"という文字列をBoolean型に変換、評価する方法
これどうするんだろうって調べていたのですが、日本語記事が見当たらなかったので書きます
【JavaScript】ClassをnewするとかObject.createでインスタンスを作らずprototype継承する外人を見つけた
Why object literals in JavaScript are cool
なるほどなーっと思いましたーー。
でわまたーー。
【React】ブラウザ間の差異をなくすcore.jsをReact内にimportする方法〜ES6,ES7のメソッドを快適に使う〜
以前の記事でObject.assignがios8で使えなくてpolyfillを使った話をしたのですけど、
core-jsで解決できるようなので試してみた。
ES6でimportして実際使ってみるまでの記事です。
読み込む
npm i -D core-js
//React内に読み込む
使いたいオブジェクト名の階層までのパスを書きメソッドを読み込む
import { findIndex, fill } from 'core-js/library/fn/array/virtual';
import { includes }from 'core-js/library/fn/array/';
import { assign } from 'core-js/library/fn/object';
const HelloReact = React.createClass({
render() {
console.log(Array(10)::fill(0).map((a, b) => b * b)::findIndex(it => it && !(it % 8)));
var obj = {a: "fa"};
console.log(assign({b: 'ooo'}, obj));
var array = ["","faf"]
console.log(array.includes("faf"));
return (
<div>
<div>
////