头图

一、前沿:

痛点场景

  • 【知道】知道有这么个api/属性,不记得名字了,打开网页查询,长长的文档 !!!慢
  • 【不知道】不知道这个对象下有什么方法?出参,入参是什么,什么类型?官方写的不详细,看不懂 !!!烦
  • 【跳晕了】想简单查看下变量A的定义,点击跳转到另外一个页面,关闭这个页面再切换回来。!!!效率太低

使用IDE智能提示的优点

解决上面的所有痛点,更快更爽更强,
所有提示,都以小窗口形式展现

Tips: 配合Typescript效果更佳,会有参数形状/类型/是否必填项等详细提示;
  • 【函数入参提示】ctrl+p
  • 【对象文档提示】提示入参,和返回值类型 ctrl+q
  • 【对象属性/方法提示】 ctrl+shift+space,支持输入自动提示
  • 【学习源码】摆脱文档,源码即文档,最好的学习方式就是看源码

二、webstrom强大的快捷键

function getArray<T>(value:T, length:number):T[]{
    let arr=[];
    if(length>0){
        for (let i=0; i<length; i++){
            arr.push(value)
        }
    }
    return arr;
}

// ctrl+q: 提示入参,返回值类型 (光标在扩号内)
// ctrl+p: 提示入参(光标在扩号内)
// ctrl+shift+i : 提示函数信息 (光标在函数名上)
getArray()

ctrl+q (query)

查看当前对象的文档:提示入参,和返回值类型

image.png

image.png

ctrl+p (params)

image.png

ctrl+shift+i (info)

image.png

ctrl+shift+space 自动提示对象参数

支持对象

image.png

支持react组件参数提示

image.png

边写边提示

image.png


tuihou123321
491 声望5 粉丝