编程谏言2

本文探讨了函数推迟绑定变量及数据结构在编程中的重要性,对比了解释器的两种不同方式:应用序与正则序,并讨论了结构化数据在程序处理过程中的优势。
本文主要想讨论关于alan的编程谏言第二条:Functions delay binding: data structures induce binding. Moral: Structure data late in the programming process. 函数推迟绑定变量,由数据结构诱导出数据绑定;教训:结构化数据在程序处理过程中比较迟。
对于阿兰的这条忠告,让我想到了编译器的两种不同的实现方式:函数式编程中解释器两种不同的解释器方式应用序和正则序。应用序是先对各个运算对象求值,然后将计算得到的值作为参数传给原过程。而正则序则是先将整个过程展开,然后将参数值代入取得最终结果。
对于阿兰的建议与正则序解释过程类似,正则序相对来说会导致部分运算过程的重复执行。因此相对来说效率相对要低点。仿佛阿兰说的这点主要是针对编译器或者解释器。我理解,先生成结构化的数据,然后再程序处理。类似做图形展现,先生成图形的结构化数据,在同一处理。这样子的处理非常的灵活。数据的保存、使用也非常的灵活。
参考来源:[url]http://www-pu.informatik.uni-tuebingen.de/users/klaeren/epigrams.html[/url]
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .slider{ width: 580px; height: 408px; overflow: hidden; border-radius: 5px; } .slider-wrapper{ position: relative; width: 100%; height: 326.25px; background-image: url("./1.avif"); background-size: cover; } .slider-wrapper .conter{ position: absolute; bottom: -50px; left: -50px; width: 120%; height: 30%; background: #14273e; filter: blur(20px); } .slider-footer{ position: relative; height: 81.75px; background-color: #14273e; padding: 12px 12px 0 12px; } .slider-footer p{ color:#fff; font-size: 18px; margin: 0; margin-bottom: 10px; } .slider-indicator{ list-style: none; margin: 0; padding: 0; display: flex; align-items: center; } .slider-indicator li{ width: 8px; height: 8px; margin: 4px; background: #fff; border-radius: 50%; opacity: 0.4; cursor: pointer; } .slider-indicator li.active{ width: 12px; height: 12px; opacity: 1; } </style> </head> <body> <div class="slider"> <div class="slider-wrapper"> <div class="conter"></div> </div> <div class="slider-footer"> <p>生死一线,噬极兽群突袭龙骨村!</p> <ul class="slider-indicator"> <li class="active"></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> </div> <script> const sliderDate = [ {url:'1.avif',title:'生死一线,噬极兽群突袭龙骨村!',color:'#14273e'}, {url:'2.avif',title:'《碧蓝航线》8周年庆典换装限时上线!',color:'#716156'}, {url:'3.avif',title:'我这么可爱,你怎么忍心不约?',color:'#dc8661'}, {url:'4.avif',title:'【毕业vlog】从哥伦比亚大学毕业啦!',color:'#353451'}, {url:'5.avif',title:'投稿音乐4K内容瓜分万元奖金!',color:'#8e98f7'}, {url:'6.avif',title:'速来一起解锁更多前沿科技知识!',color:'#283940'}, {url:'7.avif',title:'名校毕业当服务员被家人骂活该',color:'#00030c'}, {url:'8.avif',title:'有个爱记录你的男朋友,生活会是什么样',color:'#413327'}, {url:'9.avif',title:'周深谏言毕业生多尝试!6月2日现场见!',color:'#597083'}, ] // 获取页面元素 const bgimg = document.querySelector('.slider-wrapper') const conter = document.querySelector('.slider-wrapper .conter') const footer = document.querySelector('.slider-footer') const p = document.querySelector('.slider-footer p') const li = document.querySelectorAll('.slider-indicator li') let i = 0 setInterval(function(){ li[i].classList.remove('active') i++ if (i >= sliderDate.length) { i = 0 } bgimg.style.backgroundImage = `url("./${sliderDate[i].url}")` conter.style.background = sliderDate[i].color footer.style.backgroundColor = sliderDate[i].color p.innerHTML = sliderDate[i].title li[i].classList.add('active') },2000) </script> </body> </html>
06-18
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值