TypeScriptの次バージョン5.5で、開発者が長い間求めていた挙動が手に入ります。 現状のTypeScript (執筆時点で5.4)では、ユーザー定義型ガードを使う際には型述語(用語は後ほど解説します)の記述が必要です。 function isNumber(value: number | string): value is number { return typeof value === 'number'; }
![TypeScript 5.5で型述語を推論できて最高。配列のfilterも型安全に](https://cdn-ak-scissors.b.st-hatena.com/image/square/593499525e4f34689b1899d2a041087b2197de68/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--Nvs8gkS6--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3ATypeScript%2525205.5%2525E3%252581%2525A7%2525E5%25259E%25258B%2525E8%2525BF%2525B0%2525E8%2525AA%25259E%2525E3%252582%252592%2525E6%25258E%2525A8%2525E8%2525AB%252596%2525E3%252581%2525A7%2525E3%252581%25258D%2525E3%252581%2525A6%2525E6%25259C%252580%2525E9%2525AB%252598%2525E3%252580%252582%2525E9%252585%25258D%2525E5%252588%252597%2525E3%252581%2525AEfilter%2525E3%252582%252582%2525E5%25259E%25258B%2525E5%2525AE%252589%2525E5%252585%2525A8%2525E3%252581%2525AB%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_34%3A%2525E9%2525B9%2525BF%2525E9%252587%25258E%252520%2525E5%2525A3%2525AE%252Cx_220%252Cy_108%2Fbo_3px_solid_rgb%3Ad6e3ed%252Cg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyL2VlOWMzMWRhODMuanBlZw%3D%3D%252Cr_20%252Cw_90%252Cx_92%252Cy_102%2Fco_rgb%3A6e7b85%252Cg_south_west%252Cl_text%3Anotosansjp-medium.otf_30%3AUbie%252520%2525E3%252583%252586%2525E3%252583%252583%2525E3%252582%2525AF%2525E3%252583%252596%2525E3%252583%2525AD%2525E3%252582%2525B0%252Cx_220%252Cy_160%2Fbo_4px_solid_white%252Cg_south_west%252Ch_50%252Cl_fetch%3AaHR0cHM6Ly9saDMuZ29vZ2xldXNlcmNvbnRlbnQuY29tL2EtL0FPaDE0R2hwRUMxbUtjVjZsX01lT2R6N1Nsejk1SXR4WUZoYjB2LTNOdzNjV3c9czI1MC1j%252Cr_max%252Cw_50%252Cx_139%252Cy_84%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png)
TypeScriptの次バージョン5.5で、開発者が長い間求めていた挙動が手に入ります。 現状のTypeScript (執筆時点で5.4)では、ユーザー定義型ガードを使う際には型述語(用語は後ほど解説します)の記述が必要です。 function isNumber(value: number | string): value is number { return typeof value === 'number'; }
TypeScript 5.5 にて Array.filter による型の絞り込みがビルトインでサポートされるようになります。 この記事で紹介している例も、 nonNullable に相当するユーザー定義の型ガードがなくても期待する型の絞り込みが行えます。 const arr = [0, 1, 'hello', false, null, undefined]; const result = arr.filter((item) => item != null); // js: [0, 1, 'hello', false] // ts: (string | number | boolean)[] 🎉
Apple, Nike, Tesla, AirbnbなどのWebサイトやスマホアプリで使用されている、CSSの一工夫加えたスゴ技テクニックを紹介します。 美しい磨りガラスのヘッダ、コンテンツがズームするエフェクト、タッチフレンドリーなカルーセル、超クールなスワイプオーバーセクション、新感覚のスワイプアップするドロワーなど、すぐに使えるCSSのテクニックです。 my favorite clever CSS tricks by @Steve8708 下記は各ポイントを意訳したものです。 ※著者様の許諾のもと、翻訳・掲載しています。 Apple: ヘッダに使用されている美しい磨りガラスのエフェクト Appleのヘッダに使用されている、美しい磨りガラスのエフェクトはCSSで実装されています。 How does Apple make that awesome frosted glass effect
全文検索は一般的に知られていますが、検索エクスペリエンスで非常に重要な役割を果たしています。ただし、日本語など、一部の言語では、全文検索を実装するのが難しい場合があります。このブログでは、日本語で全文検索を実装する際の課題を探り、Elasticsearchでこれらの課題を解決する方法をいくつか示します。 全文検索とは? Wikipediaより、下記が定義となります。 全文検索とは、コンピュータにおいて、複数の文書(ファイル)から特定の文字列を検索すること。「ファイル名検索」や「単一ファイル内の文字列検索」と異なり、「複数文書にまたがって、文書に含まれる全文を対象とした検索」という意味で使用される。 全文検索は、現在多くのデジタル体験を強化するものです。全文検索は、データセット内に隠れている可能性のある単語やフレーズを見つけようとしてくれます。例えば、ネットショッピングして「phone」を検
こんにちは、検索基盤部 検索基盤ブロックの渡です。私は検索基盤ブロックで、主にZOZOTOWNの検索周りのシステム開発に従事しています。 以前の記事では、Elasticsearchのマッピング設定の最適化について取り上げました。そして、今回は日本語による形態素解析を実現するまでの手順をご紹介します。 techblog.zozo.com 目次 目次 はじめに Elasticsearchで全文検索を実現させる手順 全文検索のためのマッピング定義 Analyzerの構造 日本語対応のAnalyzer 日本語対応のためのプラグイン追加 kuromoji Analyzerを指定したマッピング定義の例 kuromojiプラグイン機能 カスタムしたAnalyzerのマッピング定義 Analyzerの動作確認 modeを選択した場合のマッピング定義の例 Analyzer適用の注意点 kuromoji以外の
おはようございます、藤本です。 1/31 に Elastic Stack 5.2.0 がリリースされていました。Elastic Stack 5.1.1 のリリースから 2ヶ月弱と相変わらずな早さのリリースペースにも関わらず、多くの新機能、バグフィックスが含まれていました。 英語 Elastic Stack 5.2.0 Released 日本語 Elastic Stack 5.2.0リリース 今回はいくつか新機能を触ってみましたので、メモ書きします。それではプロダクト別に順にご紹介します。 Elasticsearch 5.2.0 まずは Elasticsearch です。Elasticsearch 5.2.0 の公式ブログと、リリースノートは以下になります。 公式ブログ Elasticsearch 5.2.0 released リリースノート Elastic Stack 5.2.0 Rele
Elasticsearch では、すでに日本語で全文検索する為のトークナイザーやノーマライズなどの加工処理で使用するフィルターなどがビルトインまたは、サードパーティ製のプラグインとして多数存在します。 ここでは、日本語全文検索で使用しそうなトークナイザーやフィルターなどを説明します。 主要モジュールNGram Tokenizer N-グラムを提供するトークナイザーです。Elasticsearch にバンドルされています。Japanese (kuromoji) Analysis for Elasticsearch 日本語形態素解析を提供するプラグインです。各種 Analyzer、Tokenizer、TokenFilterが含まれます。cjk_width Token Filter 半角・全角などを統一するためのフィルターです。Elasticsearch にバンドルされています。Lowercas
マイクロソフトから正式にInternet Explorer 11 デスクトップアプリケーションのサポートを終了する発表がありました。期限は2022年6月15日です。Webサイト制作者としては歓喜の出来事ですね。 ただ、IEを気にしなくてもいいという事は、IE対応をしてきたコードの見直しも必要となります。そこで今回は、IE未対応で泣く泣くスルーしてきた即戦力なHTMLやCSSコードを14個紹介します。2022年6月以降のために今から知識を蓄えておいてはいかがでしょうか。 ちなみに、『Windows10 LTSC』や『Windows Server上のInternet Explorer11 デスクトップアプリケーション』といった一部のIE11には影響はないとの事ですが、一般ユーザーが利用する『Windows10のInternet Explorer』はサポート対象外となりますので、これはIE終了と
CSS3では、Photoshopのようなフィルター効果を再現するイメージフィルターという機能があります。 Photoshopを使用すれば画像加工を行うことができますが、外出先などで画像の編集が行えない……そのような経験、Photoshopを使用するデザイン関連の仕事をされている方なら一度や二度ありますよね。そんな時に、少しのコードをCSSに足すだけで画像編集できてしまう機能がイメージフィルターです。 今回は、画像の明度や彩度などを簡単に調整することができる、CSSイメージフィルターについてご紹介します。 とてもシンプルなコードばかりですので、使えそうなものがあれば、早速試してみてください。 CSSフィルターができること ~基本機能「9」~ 1. レンズで覗き込むようにぼかしを加える「blur」 filter: blur( ぼかしの長さ ); blurを指定すると、ガウシアンぼかしタイプのブ
今回はバリデート関数をご紹介します。 いままではフォームの値をチェックするときってだいたいpreg_match関数などでチェックしていたのですが検証専用の関数がありました。 filter関数です。pregでチェックしなくても検証してくれるので楽です。 emailとかの精度になるとどこまで許容するかが問題になるのですが、携帯アドレスのようにアカウントにドットが複数つくとエラーになります。 各フィルターは実際に試したほうがよさそうですね。どれをスルーしてどれを止めるか。デモページで確認してみてください。 スポンサーリンク filter_var関数 バリデート関係や除去関係の関数が含まれています。それぞれの関数を見ていきましょう。下記はマニュアルに例を付け足したものです。 true/falseチェック filter_var(チェックしたい値, FILTER_VALIDATE_BOOLEAN, オ
CSS3のでのボックス要素デザインを圧倒的に簡単化できる「CSS3 Click Chart... 次の記事 ≫:アプリやWEBサイトに使えそうなフリーな244個のアイコンセット kses - PHP HTML/XHTML filter | Download kses - PHP HTML/XHTML filter software for free at SourceForge.net PHPで予め許可したタグと属性以外を除去できるライブラリ「kses」。 外部からの入力値は基本的にhtmlspecialcharsでタグを無効化するのが通常の考え方ですが、掲示板なんかで特定のタグを許可したいという場合があります。 PHPにはstrip_tagsというようなタグを除去しつつ、特定のタグのみを残すという関数が標準であったりしますが、これだと属性までは制御しきれません。 更には、<a href=
大量のリストから目当てのものを瞬時に探せるようになるjQueryプラグイン「LiveFilter」 2010年01月20日- jQuery Plugin: LiveFilter 1.0.1 | Mike Merritt | Digital Inferno 大量のリストから目当てのものを瞬時に探せるようになるjQueryプラグイン「LiveFilter」。 1ページ内にリストが多く表示されていると探すのが大変ですが、LiveFilterを使えば瞬時に対象を探すことができます。 インプットボックスに検索したい文字列を入れると、一気に対象が絞り込まれ、好みのものがすぐに見つかるでしょう。 そんなの、グーグルツールバーやページ内検索を使えばいいじゃないか、という方もいると思いますが、それらの存在が知らない初心者の方に向けたページの場合は威力を発揮しそうです。 パソコン中級者や上級者の方に向けても、
ようやく、落ち着いて神戸に居れる状況になりました。 ただ、忙しさはそれ以上かもしれませんので、更新できる時に更新します! 以前から、話のあった、WebFileをPDA系の端末から見える作業ってのに、一部の方に取り組んでもらっている訳ですが、色々と考えると、面倒だったので、Filter_Viewを改造しました。この辺りが、Mapleのいいところでしょうか。 ダウンロードはこちら すいません、リンク先が間違ってましたので修正しました(2006.7.19) 金曜日の帰りの新幹線で、ふと思いついたのを、そのまま書いただけですので、たいした事は有りません。 色々と、不都合や不具合も有るかもしれませんが、一応公開しちゃいます! もっと読む... 本日、バグ指摘され、ソース見て初めて気がついたのですが、Mapleを使って、Form内の複数のボタン動作を切り替えようとするときは、 <input typ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く