タグ「console.log」 - はてブログ

タグ console.log

新着順人気順 5 users 10 users 50 users 100 users 500 users 1000 users

(1 - 25 / 31件)

【徹底比較】Vue.js と React でレンダリングされる値、されない値

2024/02/26 8 users React Props Vue.js 変数徹底比較

フロントエンドの開発・デバッグ中にコンポーネント内の変数や props の値を確認したい時、console.log() で出力するよりも画面上にレンダリングしてしまう方が分かりやすい場合もあります。コンソール出力は値の変化をリアルタイムで確認するには不向きです。一方、画面上にレンダリングすると、値の変化を直感的に把... 続きを読む

今からでも遅くないconsoleを使いこなそう - Qiita

2024/02/19 173 users Console Qiita メソッド Web開発状況

はじめにこの記事では、consoleメソッドについて紹介を行っていきます。consoleメソッドには例えばconsole.log()などが挙げられます。web開発においてconsole.log()を使用する方は多いかもしれません。しかしconsoleにはconsole.log()以外にも様々なメソッドがあるので、状況に合わせて使い分けることで少しでも快適な... 続きを読む

console.log() の代わりにdevtoolsのLogpointsを使う - Qiita

2023/10/24 150 users Qiita DevTools コンソール出力特定

Logpointsを使おう Webフロントエンドの開発をする際、デバッグ目的で「特定の処理が実行された」ということを確認するために console.log() を使うことは多いと思います。しかし、Google Chrome や Microsoft Edge で利用可能な Logpoints を利用することで、 console.log() を使わずともコンソールにメッセージを出力... 続きを読む

JavaScriptでconsole.logを使用してませんか？

2023/09/08 311 users Console JavaScript デバッグメソッド最初

はじめに Webフロントエンド開発の学習において、多くの人がまず最初にconsole.logの使い方を学びます。 console.logはデバッグの際に非常に便利なツールですが、JavaScriptにはこれ以外にも多彩なデバッグ機能が存在します。通常のconsole.logだけでなく、さまざまなconsoleのメソッドを活用することで、デバッグ作業... 続きを読む

TypeScriptではNumber.isNaN()よりもisNaN()の方が安全かもしれない

2023/08/02 7 users TypeScript nan 教義 true Hello

これまで「グローバルのisNaN()ではなくNumber.isNaN()を使え！」を教義に生きてきたのですが、揺らいできました。 JavaScriptのisNaN()は引数を数値に変換した結果がNaNであるかを判定します。一方のNumber.isNaN()はES6で提供された関数で、引数がNaN以外の時はtrueを返しません。 console.log(isNaN('hello')); // t... 続きを読む

console.log()だけのデバッグはやめよう

2023/01/19 117 users デバッグインスタンスメソッド consoleオブジェクト

はじめにフロントエンドのWeb開発においてconsole.log()というのは非常によくお世話になります．しかしconsoleオブジェクトにはには他にもたくさんのインスタンスメソッドがあり，それらを使わずに開発を行うのは少しもったいないです．この記事では様々な機能を紹介していき明日から開発で使用していただければ嬉し... 続きを読む

Chrome の console.log でハマらないために

2022/11/14 211 users 関数落とし穴 Chrome 性質デバッグ時

JavaScript を書いたことがある人ならば一度は使うであろう console.log ですが、この関数は思ったよりも厄介な性質を持っています。その性質を知らずに console.log を使うと、デバッグ時に大ハマリしてしまうことがあります。この記事では console.log の落とし穴についてお話します。今回は Chrome に特化して解説し... 続きを読む

WebAssembly と JavaScript との間で自在にデータをやりとりする

2022/11/09 53 users rust WebAssembly メモリ文字列前回

はじめに引き続き Rust + WebAssembly + SolidJS で遊んでいます。前回は、Rust 側で作成した文字列を JavaScript 側で console.log に出力することを考えましたが、今回は JavaScript 側から何らかのデータを Rust 側へ渡すことを考えたいと思います。今回も、wasm-bindgen[1] に頼らずにやっていきましょう。メモリ... 続きを読む

React大好き侍が、「もうSolidJSでいいじゃん...//」ってなったワケ。 - Qiita

2022/05/30 202 users Qiita const Button Prev div

const Counter = () => { const [count, setCount] = createSignal(0) createEffect(() => { console.log(`Count: ${count()}`) }) //第２引数はありません。SolidJSが勝手に依存している状態を感知してくれます。 return ( <div> <div>{count()}</div> <button onClick={() => setCount(prev => prev + 1)}>Add</button... 続きを読む

console.log(); しか使えなかった自分へ。。。 - Qiita

2022/05/19 696 users Qiita デバッガー Rails デバッグエディター

この記事について Webエンジニアになって早１年半。railsのデバッグをする時にはエディターのデバッガーでスマートにできていたが、javascriptになるといつもconsole.log();ばかりを使って原始的なデバッグをしていた。。。そんな脳筋な過去の自分に教えてやるための記事です。 console.log({変数名}); 「いきなりconso... 続きを読む

JavaScript で parseInt / parseFloat を使わない方が良い理由

2022/02/03 490 users parseInt Twitter バス挙動数値

先日、Twitter のタイムライン上で JavaScript における parseInt 関数の不可解な挙動に関するネタがバズっていました。 console.log(parseInt(0.000005)); // → 0 console.log(parseInt(0.0000005)); // → 5 !!!!! この記事では、JavaScript における文字列から数値への変換について簡単に説明します。 parseInt(0.0000... 続きを読む

Chrome Devtoolのmonitorを使うと関数の呼び出しを観察できて便利 - ぱすたけ日記

2021/05/02 414 users monitor ACC nums sum 関数

を読んで思い出したのでご紹介です。元の記事と同様に以下の関数 sum について、 function sum(nums, acc = 0) { console.log({ nums, acc }); if (nums.length === 0) return 0; if (nums.length === 1) return nums[0]; return sum(nums.slice(1), acc + nums[0]); } この関数sumの引数 (nums と acc) の呼び出しごと... 続きを読む

module bundler を作った - mizdev

2020/06/06 15 users mizdev foo bundler mizchi index

このフロントエンドの魔境に生まれたからには一度は俺が考えた最強の module bundler を作りたい。みんなそう思ってると思う。作った。 mizchi/bundler: hobby bundler tldr このコードが // foo.js export default 1; // index.js import foo from "./foo.js"; console.log(foo); export const index = 1; こうなる // ... 続きを読む

TypeScriptのMap<K, V>をJSON.stringify()に食わせると空のオブジェクトになって困るんですけどって時 - その手の平は尻もつかめるさ

2019/11/12 39 users TypeScript foo String map set

（TypeScriptに限らずJavaScriptでもだいたいこのような感じだと思いますが）例えば以下のようなコードを書くと，出力としては {"body":{}} が得られます． const body = new Map<string, string>().set("foo", "bar"); console.log(JSON.stringify({body})); 本当は {"body": {"foo": "bar"}} のような構造がほしいと... 続きを読む

Nuxt.js v2.7.0 の変更点と注目のポイントまとめ - Qiita

2019/05/14 32 users Nuxt.js tl;dr pull request 注目

本日 Nuxt.js v2.7.0 がリリースされました。普段は大きな変更点がある場合を除き日本語でまとめたりしないのですが、いくつか便利そうな変更点があったので簡単にまとめます。 tl;dr アップデート変わった主な変更は以下(# は該当の Pull Request) SSR 側での console.log が開発環境に限定してクライアントへと引き継... 続きを読む

今度こそ理解できる！　JavaScriptの参照が完全に分かる記事 - Qiita

2019/04/18 68 users 中略変数配列 Qiita パク

const arr1 = [1, 2, 3]; // (中略) const arr2 = arr1; arr2.push(4); // （中略） console.log(arr1); // [1, 2, 3, 4] ワイ「何や、配列を書き換えたら別の変数に入れた配列も一緒に変化したで！　JavaScriptのバグやな！」上司「バグってんのはお前の頭やろ！　もう一回勉強し直さんかい！」 ※この記事は全編やめ太... 続きを読む

#0

2018/09/05 32 users addEventListener 開発者向けツール

Service Worker とは合法ローカルプロキシ // client navigator.serviceWorker.register("/sw.js"); // sw.js self.addEventListener('fetch', event => { console.log('[fetch on sw]', event.request.url) }) service-worker いつ使える？開発者向けツール: たぶん使って OK一般向けサービス: 2020~ (Windows7 サポー... 続きを読む

(1 - 25 / 31件)

次の25件 »