JavaScript関連のことを調べてみた2021年03月31日

JSでicsファイルダウンロード

# 実現したいこと
ボタンを設置し、クリック後に[ics](https://qiita.com/TomOse/items/31b5fb4782f06d19af79)拡張子のファイルをダウンロードする機能を実装します。

## 前提

– Nuxt.js

## 手順

Vueファイルにボタンを設置します。

“`html
Outlookカレンダー（.ics）
“`

Nuxt.jsにファイルダウンロード用の[FileSaverライブラリ](https://github.com/eligrey/FileSaver.js/)を導入します。私の環境ではyarnを使用しているため、yarnでインストールします。

“`
yarn add file-saver
“`

FileSaverをインポートします。

“`js
import { saveAs } from ‘file-saver’
“`

ファイルダウンロード機能を実装します。

“`js
getIcsContent() {
c

オブジェクトの配列をflattenする

“`js
//こういう配列を
var array = [{“hello”:”aaa”},{“world”:”bbb”},{“test”:”ccc”},{“hoge”:”ddd”}];

//こうしたい
console.log(flattened);
-> {hello: “aaa”, world: “bbb”, test: “ccc”, hoge: “ddd”}
“`

reduceを使って簡易的に行うことができる。
(ただしこれだと、入れ子には対応できない)

“`js
const flattened = array.reduce((acc, val) =>{
Object.keys(val).forEach(key => acc[key] = val[key]);
return acc;
}, {});
“`

配列に同名のキーがある場合は上書きされるので注意

“`js
//同名のキーがある場合
var array = [{“hello”:”aaa”},{“world”:”bbb”},{“test”:”ccc”},{“hoge”:”ddd”}, {“worl

【GeoGebra】3種類のスクリプト記述について

## はじめに
JavaScriptでGeoGebraを操作することについての日本語記事が少ないので書きます。
GeoGebraのこの場所の使い方についてです。
## この記事の対象となる人

– GeoGebraについて踏み込んで学習したい人
– GeoGebraのツールなどは扱えるが、ボタンによる操作方法がわからない人
– JavaScriptを使って何か作ってみたい人(2次元,3次元ゲームで使う動きなんかも勉強できるのではと思っている)

## クリックして
対象となるオブジェクトがクリックされた時に実行されます。(ボタンだけではなく、点や直線なども)
![スクリーンショット 2021-03-31 10.29.36.jpg](https://qiita-image-store.s3.

Cognito Hosted UI を Nuxt.js で利用する方法の比較検討 (amazon-cognito-auth-js vs aws-amplify/auth)

# はじめに

[先にも書いた](https://qiita.com/t-kigi/items/7ead0e8946f69b1eefad) のだが、記事執筆の 2021年3月末現在 Cognito のライブラリ実装は Amplify に取り込まれている。　

しかし、自分は現時点では [**まだ** Amplify にすべてを任せられる状況ではないと考えている](https://qiita.com/t-kigi/items/cd78a2bfbf80dfa1e2ee) ので、IDaaS として Cognito を Amplify と切り離して使いたい。 そのために色々と調査したので、その過程を記す。

## 前提: Cognito UserPool の設定

UserPool は事前に作成して適時設定し、アプリクライアントの設定として以下の設定を行っている。 URLからもわかる通り、ローカル環境での動作となる。

– アプリクライアントのドメイン: `example.auth.ap-northeast-1.amazoncognito.com` (example を入力したもの)
– コ

【初心者向け】Uncaught RangeError: Maximum call stack size exceeded というエラーの意味を一言で説明します【JavaScript】

# ここだけ読め
> `Uncaught RangeError: Maximum call stack size exceeded`

これは
「処理が無限ループしてますよ」
っていう意味です。

# 例
### たとえば、関数の中で同じ関数を呼び出すようなコード

“`JavaScript
function roop(){
roop(); // 「roop()を実行すると、roop()を実行する」という処理なので無限に終わらない。
}
“`
※ if文などで、きちんとroop()を呼び出さない状況も用意してあげればセーフです。
※ そのように上手にループを活用してる関数は **再帰関数** と呼ばれています。

### たとえば、whileやforのループで、終了する条件に永久に合致しないコード

“`JavaScript
// i の値が null になることはないので、無限に終わらない。
for (let i = 0; i === null; i++) {
//処理
}
// while 条件式がずっとtrue判定なので、無限に終わらない。
while( tru

DOM上のすべてのid属性を取得する

id属性以外でも可。

“`js
//id属性が指定されているエレメントを取得して配列化する
var elm = Array.prototype.slice.call(document.querySelectorAll(“*”))
.filter(d => d.id);

//id名を取得する
var idList = elm.map(d => d.id);
“`

正規表現を使って取得するエレメントを選択する。
例えばid名が”btn_”から始まるエレメントすべてを取得する

“`js
var elm = Array.prototype.slice.call(document.querySelectorAll(“*”))
.filter(d=> /^btn_/.test(d.id));

“`

【GeoGebra】jsによって値を変更する

## 値を変更するコマンドSetValue
GeoGebraでは、値を変更する方法としてスライダーを用いる方法の他に`SetValue(変数名,値)`コマンドを用いる方法があります。使い方としては、ツールバーからボタンを配置し、スクリプトに記述します。

“`js
SetValue(α,1)
“`

余談ですがGeoGebraでαはoption+Aで打てます。

## GeoGebra ScriptではなくJavaScriptで記述する場合
複雑なアプリを作成するとなると、jsで記述しなければならないこともしばしば。そんな時は`ggbApplet.evalCommand()`内に処理を入れます。

“`js
ggbApplet.evalCommand(‘SetValue(α,1)’);
“`

JavaScript の OR演算子で未定義を回避する記述はヤバいのでメモる

# JavaScript の OR演算子で未定義を回避する記述はヤバいのでメモる

JavaScript 界隈でよくみかける

“`JS
const a = _a || 555 // OR演算子で未定義を回避する記述
“`

という記述。なんかヤバい感じがしていたので確認したら案の定だったので、メモしておきます。

推測するに、「引数 _a が undefined だったら、デフォルト値 555 を入れておく」という操作を一行で完結に書いている。
しかし、`0` や `”` や当然 `false` も未定義(undefined)と同じ判定になるので、このコードはヤバい。

# 確認コード

“`JS

let html = ”

function arg_undef_test( a1, a2, a3, a4, a5, a6, a7, a8 )
{
html += `

a1: ${ a1 || 123 }

` // -> 456 OK
html += `

a2: ${ a2 || 123 }

` // ->

【JavaScript 】aタグのhrefを書き換えたい

aタグに書かれているhrefの値をJavaScriptで変更したい。

“`HTML:HTML
About
“`

“`JS:JS
function Replace() {
let link = document.getElementById(‘link’);
let url = ‘/Home/Replace’;

//href属性の値を書き換える
link.setAttribute(‘href’, url);
}
“`

picoCTF 2021 Some Assembly Required 1 Writeup

何度，心が折れても，あきらめずに粘り強く頑張った結果解けた問題なので，うれしさのあまり Writeup を残す。


http://mercury.picoctf.net:26318/index.html

外見

ソース

“`html