<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>接口设计 on ZiYang FrontEnd Interview</title><link>https://fe-interview.pangcy.cn/tags/%E6%8E%A5%E5%8F%A3%E8%AE%BE%E8%AE%A1/</link><description>Recent content in 接口设计 on ZiYang FrontEnd Interview</description><generator>Hugo</generator><language>en-us</language><lastBuildDate>Thu, 06 Mar 2025 13:07:39 +0800</lastBuildDate><atom:link href="https://fe-interview.pangcy.cn/tags/%E6%8E%A5%E5%8F%A3%E8%AE%BE%E8%AE%A1/index.xml" rel="self" type="application/rss+xml"/><item><title>对象类型定义方式对比</title><link>https://fe-interview.pangcy.cn/docs/typescript/typescript-06/</link><pubDate>Tue, 04 Mar 2025 08:37:03 +0000</pubDate><guid>https://fe-interview.pangcy.cn/docs/typescript/typescript-06/</guid><description>&lt;h2 id="考察点分析">考察点分析 &lt;a href="#%e8%80%83%e5%af%9f%e7%82%b9%e5%88%86%e6%9e%90" class="anchor" aria-hidden="true">&lt;i class="material-icons align-middle">link&lt;/i>&lt;/a>&lt;/h2>&lt;p>该题目主要考察以下核心能力维度：&lt;/p>
&lt;ol>
&lt;li>&lt;strong>TypeScript类型系统理解&lt;/strong>：对类型定义基础语法的掌握程度&lt;/li>
&lt;li>&lt;strong>类型工具辨析能力&lt;/strong>：区分interface和type在不同场景下的适用性&lt;/li>
&lt;li>&lt;strong>细节特性把控&lt;/strong>：可选属性和只读属性等高级类型特性的正确使用&lt;/li>
&lt;/ol>
&lt;p>具体评估点包括：&lt;/p>
&lt;ul>
&lt;li>对象类型声明语法差异&lt;/li>
&lt;li>可选属性（Optional Properties）定义规范&lt;/li>
&lt;li>只读属性（Readonly Modifier）实现方式&lt;/li>
&lt;li>interface声明合并特性认知&lt;/li>
&lt;li>type扩展联合类型能力&lt;/li>
&lt;/ul>
&lt;hr>
&lt;h2 id="技术解析">技术解析 &lt;a href="#%e6%8a%80%e6%9c%af%e8%a7%a3%e6%9e%90" class="anchor" aria-hidden="true">&lt;i class="material-icons align-middle">link&lt;/i>&lt;/a>&lt;/h2>&lt;h3 id="关键知识点">关键知识点 &lt;a href="#%e5%85%b3%e9%94%ae%e7%9f%a5%e8%af%86%e7%82%b9" class="anchor" aria-hidden="true">&lt;i class="material-icons align-middle">link&lt;/i>&lt;/a>&lt;/h3>&lt;p>Interface基本类型声明 &amp;gt; Type类型别名声明 &amp;gt; 声明合并特性 &amp;gt; 扩展能力差异&lt;/p>
&lt;h4 id="1-基础定义">1. 基础定义 &lt;a href="#1-%e5%9f%ba%e7%a1%80%e5%ae%9a%e4%b9%89" class="anchor" aria-hidden="true">&lt;i class="material-icons align-middle">link&lt;/i>&lt;/a>&lt;/h4>


 
 
 

 
 
 
 

 

 &lt;div class="prism-codeblock ">
 &lt;pre id="85f14fe" class="language-typescript ">
 &lt;code>// Interface方式
interface Person {
 name: string
 age: number
}

// Type方式
type Person = {
 name: string
 age: number
}&lt;/code>
 &lt;/pre>
 &lt;/div>
&lt;h4 id="2-可选属性">2. 可选属性 &lt;a href="#2-%e5%8f%af%e9%80%89%e5%b1%9e%e6%80%a7" class="anchor" aria-hidden="true">&lt;i class="material-icons align-middle">link&lt;/i>&lt;/a>&lt;/h4>&lt;p>两者均使用&lt;code>?:&lt;/code>语法：&lt;/p>



 
 
 

 
 
 
 

 

 &lt;div class="prism-codeblock ">
 &lt;pre id="9f43d23" class="language-typescript ">
 &lt;code>interface Person {
 name: string
 age?: number // 可选属性
}

type Person = {
 name: string
 age?: number
}&lt;/code>
 &lt;/pre>
 &lt;/div>
&lt;h4 id="3-只读属性">3. 只读属性 &lt;a href="#3-%e5%8f%aa%e8%af%bb%e5%b1%9e%e6%80%a7" class="anchor" aria-hidden="true">&lt;i class="material-icons align-middle">link&lt;/i>&lt;/a>&lt;/h4>&lt;p>均使用&lt;code>readonly&lt;/code>修饰符：&lt;/p></description></item></channel></rss>