第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定

組件化開發(fā)的思考

標(biāo)簽:
JavaScript

经历过很多场面试,以及对自己所做项目的思考与积累。对于组件化的开发有了一点点理解。
其实开发一个项目,就类似与做一个乐高玩具。乐高由不同的积木块拼成,每个积木块可以和不同的积木块连接。
而且积木块与积木块之间没有影响。一个萝卜一个坑,只要这个坑你能填进去,你就适合。
而我们开发一个项目的时候,就要规划好那些功能.在前端来说,就是哪些标签,哪些CSS,哪些JS能够抽象成一个积木块。
在编程开始后,再不断的改进这个积木块所需要用到的数据,事件。积木块之间的影响如何尽量的解耦。
父组件子组件的数据如果传递和更改。

如何实现组件化

组件在spa的实现

  1. 通过jsx或者template,在文件中定义好css,js。
  2. 此组件需要那些属性。属性是通过props由上级传过来,还是直接定义在data,又或者是定义在状态管理中。
  3. 数据是否需要持久化,缓存?因为spa在一次刷新之后,会初始化(根据你写的代码)数据状态,所以我们需要记录这些数据,
    这些数据是存在 localstorage还是cookie,使用storage时是否需要考虑到向后兼容。
  4. 数据的改变,是提交至状态管理,还是通过子组件事件提交,父组件监听相应的事件去改变这个数据。
  5. 某个功能是否有必要将它抽象成组件,主要看复用需求,因为转换成组件,往往需要改变很多页面的结构,以及数据,事件。
  6. 组件的可拓展性,如果需要这个组件完成新加的需要,改动最小。

    组件在JQuery中的实现

  7. 先写好这个组件的样式,以及功能。
  8. 创建一个构造函数,包含组件实例的创建,将1中的html代码转成字符串进行拼接。或者DocumentFragment对象。
  9. 绑定事件。
  10. 将需要用到的数据,用过事件的参数传递。
  11. 插入到指定的位置,append

面向对象开发

在进行组件化的开发时,其实就已经有面向对象开发的思想,你就能用到构造函数、prototype、继承等面向对象开发的特性。
但是这个步骤不需要强制的使用到所有的场景,因为有时候抽象组件时你花费的时间,以及组件的健壮性都不能让你满意。
按照需求去敲代码,思考。才是最适合开发者的方式。
而且,一种开发思想的建立,是需要代码量,需要自我驱动的思考。

點(diǎn)擊查看更多內(nèi)容
1人點(diǎn)贊

若覺得本文不錯(cuò),就分享一下吧!

評(píng)論

作者其他優(yōu)質(zhì)文章

正在加載中
感謝您的支持,我會(huì)繼續(xù)努力的~
掃碼打賞,你說多少就多少
贊賞金額會(huì)直接到老師賬戶
支付方式
打開微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊(cè)有機(jī)會(huì)得

100積分直接送

付費(fèi)專欄免費(fèi)學(xué)

大額優(yōu)惠券免費(fèi)領(lǐng)

立即參與 放棄機(jī)會(huì)
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)

舉報(bào)

0/150
提交
取消