学习TypeScript 7(内置对象)
JavaScript 中有很多内置对象,它们可以直接在 TypeScript 中当做定义好了的类型。
ECMAScript 的内置对象
Boolean、Number、String、RegExp、Date、Error// 内置对象 //ECMAScript 的内置对象 //**`Boolean`、Number、`String`、`RegExp`、`Date`、`Error`** //例子 //都是大写开头的 都是new一个对象 const regexp:RegExp = /\w\d\s/ //声明一个正则表达式 const date:Date = new Date() // const time:number = new Date().getDate() const error:Error = new Error('错误') const b:Boolean = new Boolean(false) const n:Number = new Number(true) const s:String = new String('对象')
DOM 和 BOM 的内置对象
Document、HTMLElement、Event、NodeList等//DOM 和 BOM 的内置对象 //例子 读出index.html 中 id=list的下面的四个li标签 const list:NodeList = document.querySelectorAll('#list li') console.log(list); //读取body const body:HTMLElement = document.body console.log(body); //读取单独的div const div:HTMLDivElement|null = document.querySelector('div') console.log(div);<body> <div> <ul id="list"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> </div> </body> <script src="./index.js"></script>效果:
注意
let body: HTMLElement = document.body; let allDiv: NodeList = document.querySelectorAll('div'); //读取div 这种需要类型断言 或者加个判断应为读不到返回null let div:HTMLElement = document.querySelector('div') as HTMLDivElement document.addEventListener('click', function (e: MouseEvent) { }); //dom元素的映射表 //所有dom元素都在这里了 interface HTMLElementTagNameMap { "a": HTMLAnchorElement; "abbr": HTMLElement; "address": HTMLElement; "applet": HTMLAppletElement; "area": HTMLAreaElement; "article": HTMLElement; "aside": HTMLElement; "audio": HTMLAudioElement; "b": HTMLElement; "base": HTMLBaseElement; "bdi": HTMLElement; "bdo": HTMLElement; "blockquote": HTMLQuoteElement; "body": HTMLBodyElement; "br": HTMLBRElement; "button": HTMLButtonElement; "canvas": HTMLCanvasElement; "caption": HTMLTableCaptionElement; "cite": HTMLElement; "code": HTMLElement; "col": HTMLTableColElement; "colgroup": HTMLTableColElement; "data": HTMLDataElement; "datalist": HTMLDataListElement; "dd": HTMLElement; "del": HTMLModElement; "details": HTMLDetailsElement; "dfn": HTMLElement; "dialog": HTMLDialogElement; "dir": HTMLDirectoryElement; "div": HTMLDivElement; "dl": HTMLDListElement; "dt": HTMLElement; "em": HTMLElement; "embed": HTMLEmbedElement; "fieldset": HTMLFieldSetElement; "figcaption": HTMLElement; "figure": HTMLElement; "font": HTMLFontElement; "footer": HTMLElement; "form": HTMLFormElement; "frame": HTMLFrameElement; "frameset": HTMLFrameSetElement; "h1": HTMLHeadingElement; "h2": HTMLHeadingElement; "h3": HTMLHeadingElement; "h4": HTMLHeadingElement; "h5": HTMLHeadingElement; "h6": HTMLHeadingElement; "head": HTMLHeadElement; "header": HTMLElement; "hgroup": HTMLElement; "hr": HTMLHRElement; "html": HTMLHtmlElement; "i": HTMLElement; "iframe": HTMLIFrameElement; "img": HTMLImageElement; "input": HTMLInputElement; "ins": HTMLModElement; "kbd": HTMLElement; "label": HTMLLabelElement; "legend": HTMLLegendElement; "li": HTMLLIElement; "link": HTMLLinkElement; "main": HTMLElement; "map": HTMLMapElement; "mark": HTMLElement; "marquee": HTMLMarqueeElement; "menu": HTMLMenuElement; "meta": HTMLMetaElement; "meter": HTMLMeterElement; "nav": HTMLElement; "noscript": HTMLElement; "object": HTMLObjectElement; "ol": HTMLOListElement; "optgroup": HTMLOptGroupElement; "option": HTMLOptionElement; "output": HTMLOutputElement; "p": HTMLParagraphElement; "param": HTMLParamElement; "picture": HTMLPictureElement; "pre": HTMLPreElement; "progress": HTMLProgressElement; "q": HTMLQuoteElement; "rp": HTMLElement; "rt": HTMLElement; "ruby": HTMLElement; "s": HTMLElement; "samp": HTMLElement; "script": HTMLScriptElement; "section": HTMLElement; "select": HTMLSelectElement; "slot": HTMLSlotElement; "small": HTMLElement; "source": HTMLSourceElement; "span": HTMLSpanElement; "strong": HTMLElement; "style": HTMLStyleElement; "sub": HTMLElement; "summary": HTMLElement; "sup": HTMLElement; "table": HTMLTableElement; "tbody": HTMLTableSectionElement; "td": HTMLTableDataCellElement; "template": HTMLTemplateElement; "textarea": HTMLTextAreaElement; "tfoot": HTMLTableSectionElement; "th": HTMLTableHeaderCellElement; "thead": HTMLTableSectionElement; "time": HTMLTimeElement; "title": HTMLTitleElement; "tr": HTMLTableRowElement; "track": HTMLTrackElement; "u": HTMLElement; "ul": HTMLUListElement; "var": HTMLElement; "video": HTMLVideoElement; "wbr": HTMLElement; }//定义 promise类型 function promise():Promise<number> { return new Promise<number>((resolve,rejict)=>{ resolve(1) }) } promise().then(res=>{ console.log(res) })结果为: 输出了
1
评论
匿名评论
隐私政策
你无需删除空行,直接评论以获取最佳展示效果
