init メソッド(関数) が必要な理由を述べよ
Q.
init メソッド(関数)
が必要な理由を述べよ
A.
イベントリスナーの登録や、外部データの取得など「一回だけやればいいこと」は init にまとめておくと管理しやすいから。
逆に言えば
なぜ method だけで完結しないというと
method を設計的にシンプルにしておきたい(「呼ばれたらすぐ処理」だけにする)。
準備と実行を分けることで、複数回使う・再初期化するなどの拡張がしやすくなる。
web系の処理の流れは下記である。
-
DOM生成
-
HTMLの構造が読み込まれ、要素が存在する状態。
-
-
init(初期化処理)
-
DOMを使って一度だけ行う設定・準備。
-
例: イベントの登録、デフォルト値の設定、UIの構築など。
-
-
method(実行処理)
-
初期化された状態を使って、実際に操作を行う関数や処理。
-
例: ユーザーのアクションに応じてDOMを更新するなど。
-
css postion absolute relative の使い方
Q.
■四角をブラウザの画面の中央に配置せよ。
(css 設定でpostion absolute relative を使おう)
A.
正解は親要素にpostion relative, 子要素にpostion absoluteを指定するのが正解だ。
これを理解するには2つのCSSの考え方を理解しなければならない。
① 親要素と子要素
親要素とは、子要素を包含する要素のことであり、レイアウトの基準点となる。
子要素は、その親要素の中に配置され、親の position によって動作が変わる。
特に、親に position: relative; を設定すると、子要素の absolute の基準がその親になる。
② position の基準の考え方
absolute は通常、最も近い position: relative; を持つ親要素 を基準に配置される。
もし親要素に position: relative; が指定されていなければ、absolute は body(または html)を基準にして配置される。
この2つの考え方を理解すれば、absolute を意図した位置に正しく配置できるようになる。
css position の使い方
Q.
■四角をブラウザの画面の中央に配置せよ。
A.
これはcss の設定positionのでfixを使うことが正解である。
✅ fixed を使うことで、スクロールしても常に画面の中央に固定されます。
これを次にabsolute とrelativeで表現してみよう。
grasshopper のデータ構造の作り方(GRAFT )
Q.GRAFTとは何か?データツリーの観点から説明せよ。
A.グラフトとはブランチを増やして、リストの数値を個別に格納させる機能である。
GRAFT を使いこなせるようになるには、ブランチ(BRANCH) とリスト(LIST) の関係の理解しておく必要がある
GRAFTとは、各要素が個別の枝(Branch)に配置され、より複雑なデータ構造が形成されます。この操作は、ツリー構造のデータを操作する際に特に便利であり、データの解析や操作をより効果的に行うことができます。
単一のリスト内にいくつかの要素が含まれている場合、それぞれの要素を個別の枝に配置することで、より多層のデータ構造を作成することができます。
3DCG grasshopper をコンピュータサイエンスで考える
RHINO GRASSHOPPERを通じてコンピュータサイエンスの入口にすることに興味を持っている方へ
RHINO GRASSHOPPERは、デザインや建築分野で広く使われているツールですが、実はコンピュータサイエンスの入門にも最適なプラットフォームです。その理由は、グラフィカルなプログラミング環境を提供し、プログラミング初心者でも直感的にコードを作成し、ビジュアルなフィードバックを得ることができるからです。
RHINO GRASSHOPPERを学ぶことで、プログラミングの基本的な概念や論理を学びながら、デザインや建築に関する興味深いプロジェクトを実現することができます。例えば、アルゴリズム設計やデータ構造、条件分岐などのプログラミングの要素を、デザインや建築のコンセプトに応用することができます。
また、RHINO GRASSHOPPERのコミュニティは非常に活発で、さまざまなレベルや分野の人々が集まっています。そのため、初心者から上級者まで、自分のレベルや興味に合った学び方やプロジェクトに参加することができます。
つまり、RHINO GRASSHOPPERを通じてコンピュータサイエンスの入口を探求することは、非常に興味深く、充実した学びの旅になることでしょう。ぜひ、この素晴らしいツールを使って、新しい知識やスキルを身につけ、創造性豊かなプロジェクトを実現してください。
私は建築の設計実務でGRASSHOPPER を使ってきた経験及びコンピュータサイエンスのバックグラウンドがあるので、いろいろな記事をアップしていきたいとおもいます
grasshopper のデータ構造をコンピュータサイエンスで考える
プログラムでは扱うデータに何かしらの意図を持たせたいとき、扱うデータに構造を持たせます。構造とはヒエラルキーをつけるということです。
いきなり問題です。一番シンプルなデータ構造は何だと思いますか?
正解は配列arrayです。
一度は聞いたことがある人もいるかもしれません。
これは同じ型の要素を連続したメモリ領域に格納します。
char c = {1,2,3}
のように記述します。
Grasshopperでも同様で、3次元のジオメトリや複雑なデータを効果的に扱うために、適切なデータ構造を持つことが必要です。これにより、データの整理、操作、可視化などがスムーズに行われます。ではどのようなデータ構造がgrasshopperにあるのかというと、下記の図を見てください。
Grasshopper 開発者の David Rutten によって描かれたイメージです。

これは、データツリーと呼ばれるgrasshopper 特有の概念です。
このデータツリーを理解する為に2つのデータ構造を理解する必要があります。
1つ目はツリー構造と呼ばれるモノで、
2つ目はlist構造と呼ばれるものです。
このツリー構造とリスト構造の2つが組み合わさったものがラスホッパーのデータ構造データツリーと呼ばれるものです。
上記を理解した上で図を改めてみてみましょう。
ツリーと呼ばれる枝分かれした枝にデータ構造(リスト)が格納されているのがわかるでしょうか?
一つの基本となるブランチ(枝(幹といっても良い))が、path{0}
に相当します。
またブランチの中にリストが格納されます。各ブランチは階層構造を表す数字の列が列挙されていて、数字が深くなるほどこの階層構造が深くなります。(サブブランチが作成されます)このパスは、データは持ちませんが、デフォルトで3 つのサブ・ブランチを持ちます。これらの 3 つ
のサブ・ブランチは、マスター・ブランチのインデックッス{0}を持ち、自身のインデックス、0,1,2 を
持ちます。
-
ツリー構造(Tree Structure):
- ツリー構造は、親子関係に基づいて階層化されたデータの構造を表します。
- 各ノードは、1つの親ノードと複数の子ノードを持つことができ、それぞれの子ノードはさらに別の子ノードを持つことができます。
- ツリー構造は、階層的な関係を表現するために使用されます。
-
リスト構造(List Structure):
- リスト構造は、順序付けられた要素のシーケンスを表します。
- リスト内の各要素は、インデックスによって一意に識別されます。
- リスト構造は、複数の要素を順番に格納するために使用され、特定の順序でデータを処理する場合に有用です。
Grasshopperのデータ構造は、これらのツリー構造とリスト構造が組み合わさったものです。具体的には、ツリー内の各ブランチにはリストが格納され、そのリスト内の要素が個々のデータを表します。これにより、複雑な階層構造を持つデータを効果的に管理し、操作することができます。
APIって何?
Q.
APIとは何か?
A.
簡単に言えば、APIは異なるソフトウェアやサービス間の「通訳」のようなものです。一方のアプリケーションが理解できる形で情報を要求し、もう一方のアプリケーションが理解できる形で情報を提供します。これにより、異なるシステム間でスムーズなデータのやり取りが可能になります。
凡人: APIってよく聞くけど、それって何?
恋するコンピュータサイエンス: APIは「Application Programming Interface」の略で、異なるソフトウェアやサービス間で情報をやり取りするためのルールや手順を定めたものだよ。
凡人: それはどんな時に使うの?
恋するコンピュータサイエンス: 例えば、あるアプリが天気予報の情報を表示したい時、天気予報サービスのAPIを通じてデータを取得するんだ。これによって、異なるシステム間でもスムーズに情報交換ができるようになる。
凡人: なるほど。でもなんでそんなに重要なの?
恋するコンピュータサイエンス: APIがないと、各々のシステムやサービスが互いに通信するための独自の方法を開発しなければならなくなる。APIによって、開発者は簡単に多様な機能やデータを活用できるようになるんだ。
凡人: へえ、それは便利そうだね。ありがとう!