JavaScript のコードを整形する

以下のサイトを利用した。

Online JavaScript Beautifier (v1.13.0)
https://beautifier.io/

## コードを貼って、 Beautifully Code で整形

## いろいろできる
### フォーマットが指定できる

こうなる。
![スクリーンショット 2021-01-03 10.40.57.png](https://qiita-image-store.

【備忘録】ショートサーキット評価【TypeScript】

# ショートサーキット評価

TypeScript,JavaScript 初学者が関数の**ショートサーキット評価**について勉強したのでメモを残す。

## ショートサーキット評価（短絡評価）

– `&&`や`||`、`!`などの論理演算子を利用する

OR 演算子`||`は**左辺が falsy な値の場合、評価は右辺に渡される**

“`typescript
const hoge = undefined || null || 0 || NaN || “” || “hoge”;
“`

– `undefined`と`null`、`0`、`NaN`、`”`はすべで`falsy`なので一番右の`hoge`が左辺に代入される
– **初期化を動的に行う際に便利**

AND 演算子`&&`は**左辺が truthy な値の場合、評価が右辺に渡される**

“`typescript
const bar = ” ” && 100 && [] && {} && “bar”;
“`

if 文の代わりに使うこともできる

“`typescript
false && console.

囲みマスのサンプルAIの解説

# 概要
2020年に開催予定だった高専プロコンの競技部門

競技部門のルールは2チーム対戦型の陣取りゲームの[囲みマス](http://www.procon.gr.jp/?p=77044)でした

しかし感染拡大予防のため競技部門は中止になりました

そこで公開されている競技ルールをもとに
競技システムを開発しオンライン対戦会を行うため
[Code for KOSEN 囲みマスプロジェクト](https://codeforkosen.github.io/)が発足しました

開発した競技システムはGitHubで公開されています
好きな時に囲みマスの対戦会を開くことができます
https://github.com/codeforkosen/Kakomimasu

システムには対戦AIを作りたい方のために
いくつかのサンプルAIが含まれています

この記事ではサンプルAI同士を対戦させる手順と
サンプルAIの行動について簡単に解説します

# システムのセットアップ
対戦サーバとサンプルAIはDenoで実装されていますので
まずはDenoをインストールします

Windowsユーザの方はP

Nuxt.js+Vuetify で 画像が表示できない時に固定の画像を出す方法

# はじめに

最近Nuxt.js を触り始めて、Typescript までたどり着くことを目標に学習始めました。

# やりたいこと

あるページで、サーバから指定された画像を表示しますが、それが存在しない時はフロントサイドで持っている情報で固定画像を表示したいです。

# 試したやりかた

“`javascript:page.vue

…
methods:
errImg(event) {
event.target.src = ‘no_image.jpg’ // static/no_image.jpg に正しく表示できる画像ファイルがある
}
“`

# このやり方だと。。。

404 エラーの時に、error が発火しない。

– `response.img=存在しない画像` の場合、no_mage.jpg　が表示されました
– `http://example.com/test.jpg` の場合には何も表示されませんでした
– `errImg()` に、`console

JavaScriptでは配列はオブジェクト

# 配列はオブジェクト

JavaScriptでは、配列はオブジェクトです。

arr[0] とすると ‘a’ が取り出せますが、これはプロパティ ‘0’ の値が ‘a’ ということです。
だから arr[‘0’] でも同じように ‘a’ が取り出せます。

こんなこともできます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/638864/3e3fd4e6-873b-7ef1-e22f-2ba47134b5

React(typescript)で外部scriptを遅延ロードする方法

#今回陥った内容の概要

React(typescript)で外部scriptを使用する**だけ**なのだがかなりの時間と調査を要して解決したのでのでナレッジの共有をしたいと思います。
ただベストプラクティスではないと思っており、実装内容も少しレガシーの方法となっております。
今回は外部scriptになるが古いライブラリを使用する場合、React(typescript)ですが、`＠type`に対応していないものを使用する内容となっております。

#今回の用件
– 実装はReactでのSPA
– 外部scriptはbody内に任意の箇所
– headerにはプロパティを追加する外部scriptなし
– innerHtmlはサニタイズを考慮して使用不可
– 外部script内に`document.write`が使用されている()
– 外部script内にさらなる外部scriptが使用されている

#試したアプローチ

##1.scriptタグの生成

`useEffect`で以下のコードを実装

“`typescript:logic.tsx
const script = documen

GASでLINEからTwitterに投稿してみた

新年から行動量を増やしていくために何かを作ろうと考えていました:thinking:
そんな時にふと**「LINEからTwitterに投稿できないかなぁ・・・」**と思いつき、早速簡単にLINE
Botを作ってみました。
(随時アプデ予定)

#参考記事
[[Google Apps Script] LINE Bot を作ってみよう](“https://dev.classmethod.jp/articles/gas-line/”)
[GASでTwitterAPIを叩いてみる](“https://tech-cci.io/archives/4228”)

上記の記事からAPIの連携を済ませました。
これらの記事で環境準備はできてしまうと思います。
皆さんも記事を参考に連携してみてください。

#実際のコード
APIの連携が済んだら、あとはコードを書くだけで実装できます。

“`tweetByLine.js

function doPost(e) {

// Lineで投稿した内容をMessageに格納
var Message = JSON.parse(e.postData.cont

[JavaScript] trim()メソッドは文字列両端の改行文字 \n や \r を削除する。

String.trim()メソッドは文字列両端の`空白`を削除する。

この`空白`は、文字通りの空白であるスペースやタブだけでなく、改行文字`\r`, `\n`, `\r\n`も含む。

“`JavaScript

const memo = ‘とんこつラーメンか、\r\n醤油とんこつラーメンで’;

const array1 = memo.split(‘\r’)
console.log(array1);
// [ ‘とんこつラーメンか、’, ‘\n醤油とんこつラーメンで’ ]

const array2 = memo.split(‘\n’).map(m => m.trim())
console.log(array2);
// [ ‘とんこつラーメンか、’, ‘醤油とんこつラーメンで’ ]

const array3 = memo.split(‘\r’).map(m => m.trim())
console.log(array3);
// [ ‘とんこつラーメンか、’, ‘醤油とんこつラーメンで’ ]

const array4 = memo.split(‘、’).map(m

「おかしなりんご」ゲーム

1.はじめに

この記事のターゲットは「HTML、CSS、JavaScriptを一通り学んだけど何をしたらいいかわからない人」向けです。
この記事を見ることで以下の項目の悩みを解決できると思います。

• プログラミング一通り経験したけど何をしたらいいのか
• JavaScriptでできることは？
• 簡単なゲームを作りたい

2.作者紹介

プログラミングを初めて２ヶ月の「大学３年生」です。
スキルセットとしては以下のような感じです。

• HTML&CSSがだいたい分かる
• JavaScriptは少しわかる（機能を見てある程度推測できる）
• ちょっとしたデータサイエンスに関する知識

最近は模写を中心に独学しています。

3.アプリ概要

【PAY.JP】環境変数の設定について〜困ったときには削除の勇気〜

### 解決したいこと
クレジットカード決済の購入機能実装で、環境変数を設定するとtokenが発行されなくなってしまう。

### 発生している問題・エラー
“`
「　Token can’t be blank　」と表示される
“`

### 自分で試したこと

仮説1・そもそもトークンが生成されていない

トークンが生成されるまでの流れとしては、

**①ブラウザで入力したカード情報を取得する→
②取得したカード情報と公開鍵をもとにPAY.JP側（API）へアクセスする→
③PAY.JP側でトークンが発行される**

この中のどこかがうまくいっていないのではないか？

まずは①で、JavaScriptのファイルがきちんと読み込めているか確認。

“`javascript

const pay = () => {
console.log(“OK”) //⬅️検証ツールでブラウザに「OK」と表示されるか確認

//以下略

“`

確認できたので次はカード番号が取得できているか確認。

“`javascript

const pay = ()=> {

元記事を表示

javascriptとjQuery比較

テストを赤文字に変更する処理をjavascriptとjQueryで書いてみる

“`
// javascript

テスト

“`
“`

テスト