「趣学前端」元编程,翻书学习时发现的陌生词汇,当然是记个笔记

简介: 最近在重学前端,今天分享元编程的知识点。

背景

最近睡前习惯翻会书,最近在重温《JavaScript权威指南》这本书。这本书,文字小,内容多。两年了,我才翻到第十章。因为书太厚,平时都充当电脑支架。

今天看文章目录的时候,发现一个章节叫「元编程」。我看书中的解释

常规编程是写代码去操作数据,元编程则是写代码去操作其他代码。

我是这样理解的,用代码去操作代码就意味着被操作的代码有可以被扩展的特性,比如可写、可枚举等。而这些特性,可以帮助实现一些特别的功能。利用特性去编写功能的过程可以被归结为「元编程」。比如编写可重用的库等。

元编程特性

属性的三个特性

可写、可枚举、可配置,这三个特性前两个我晓得,但是最后一个我没啥印象了。来看书里对三个特性的解释

可写(writable)特性指定是否可以修改属性的值。

可枚举(enumerable)特性指定是否可以通过for/in循环和Object.keys()方法枚举属性。

可配置(configurable)特性指定是否可以删除属性,以及是否可以修改属性的特性。

可以使用Object的getOwnPropertyDescriptor方法,帮助获取对象上某个属性的属性描述符。如果不存在则会返回undefined。

letobj= {
name: '张三',
age: 17,
};
// name属性存在console.log(Object.getOwnPropertyDescriptor(obj, 'name')); // => { value: '张三', writable: true, enumerable: true, configurable: true }// interest属性不存在console.log(Object.getOwnPropertyDescriptor(obj, 'interest')); // => undefined

示例代码中不存在interest属性,但是也不是不可以有。Object.defineProperty()方法可以帮助对象创建一个指定了特性的属性。

Object.defineProperty(obj, 'interest', {
value: '华夏美食、国漫、古风重度爱好者',
writable: true,
enumerable: true,
configurable: true,
});
console.log(obj.interest); // => 华夏美食、国漫、古风重度爱好者

Proxy

使用Proxy可以修改JavaScript对象的基础行为,并创建具体普通对象无法企及能力的代理对象。

代理对象可以从目标对象和处理器对象上获取它们的行为,进行特定处理;也可以只拦截对象操作,但仍然把操作委托给目标对象。

前一种方式可以帮助创建一个只读器,所有试图写入的操作都会抛出异常。

functionreadonlyProxy(p) {
functionreadonly() {
thrownewTypeError('该方法是只读方法');
  }
returnnewProxy(p, {
set: readonly,
defineProperty: readonly,
deleteProperty: readonly,
setPrototypeOf: readonly,
  });
}
letobj= {
name: '张三',
age: 17,
};
letw=readonlyProxy(obj);
// 可以正常读取属性console.log(w.name); // => 张三// 删除报错deletew.age; // => TypeError: 该方法是只读方法// 写入报错w.interest='华夏美食、国漫、古风重度爱好者'; // => TypeError: 该方法是只读方法

后一种方式可以用于打印日志。这个功能占了满满三页,太长了,容我再学习一下。

模版标签

位于反引号之间的字符串被称为“模版字面量”。可以把定义使用标签化模版字面的标签函数看成是元编程。

比如String.raw``,可以返回反引号中未经处理的文本。

letlen=String.raw`\n`.length;
console.log(len); // => 2:一个反斜杠字符和一个字母n

虽然不知道实际使用场景,但是多学一点总有好处,保不齐将来可能会用到。

总结

温故果然可以知新。学习完元编程的章节,已经没有最初看到它的时候那么困惑了,感觉有些难读懂的源代码有望读懂了。而且打印日志的功能,我准备再研究研究,我有预感,肯定能有用。

《JavaScript权威指南》真是一本宝藏图书,看来有必要把其他章节都学习一下。

今天也特别有收获的一天。

目录
打赏
0
0
1
1
1101
分享
相关文章
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
352 14
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
183 26
独家揭秘:前端大牛们如何高效学习新技术,保持竞争力!
【10月更文挑战第31天】前端技术飞速发展,如何高效学习新技术成为关键。本文通过对比普通开发者与大牛们的策略,揭示了高效学习的秘诀:明确目标、主动探索、系统资源、实践应用和持续学习。通过这些方法,大牛们能更好地掌握新技术,保持竞争力。示例代码展示了如何通过实践加深理解。
84 4
前端大模型应用笔记(一):两个指令反过来说大模型就理解不了啦?或许该让第三者插足啦 -通过引入中间LLM预处理用户输入以提高多任务处理能力
本文探讨了在多任务处理场景下,自然语言指令解析的困境及解决方案。通过增加一个LLM解析层,将复杂的指令拆解为多个明确的步骤,明确操作类型与对象识别,处理任务依赖关系,并将自然语言转化为具体的工具命令,从而提高指令解析的准确性和执行效率。
116 6
前端大模型应用笔记(四):如何在资源受限例如1核和1G内存的端侧或ECS上运行一个合适的向量存储库及如何优化
本文探讨了在资源受限的嵌入式设备(如1核处理器和1GB内存)上实现高效向量存储和检索的方法,旨在支持端侧大模型应用。文章分析了Annoy、HNSWLib、NMSLib、FLANN、VP-Trees和Lshbox等向量存储库的特点与适用场景,推荐Annoy作为多数情况下的首选方案,并提出了数据预处理、索引优化、查询优化等策略以提升性能。通过这些方法,即使在资源受限的环境中也能实现高效的向量检索。
129 1
前端大模型应用笔记(二):最新llama3.2小参数版本1B的古董机测试 - 支持128K上下文,表现优异,和移动端更配
llama3.1支持128K上下文,6万字+输入,适用于多种场景。模型能力超出预期,但处理中文时需加中英翻译。测试显示,其英文支持较好,中文则需改进。llama3.2 1B参数量小,适合移动端和资源受限环境,可在阿里云2vCPU和4G ECS上运行。
248 1
前端大模型应用笔记(五):大模型基础能力大比拼-计数篇-通义千文 vs 文心一言 vs 智谱 vs 讯飞vsGPT
本文对比测试了通义千文、文心一言、智谱和讯飞等多个国产大模型在处理基础计数问题上的表现,特别是通过链式推理(COT)提示的效果。结果显示,GPTo1-mini、文心一言3.5和讯飞4.0Ultra在首轮测试中表现优秀,而其他模型在COT提示后也能显著提升正确率,唯有讯飞4.0-Lite表现不佳。测试强调了COT在提升模型逻辑推理能力中的重要性,并指出免费版本中智谱GLM较为可靠。
138 0
前端大模型应用笔记(五):大模型基础能力大比拼-计数篇-通义千文 vs 文心一言 vs 智谱 vs 讯飞vsGPT
VUE学习四:前端模块化,ES6和ES5如何实现模块化
这篇文章介绍了前端模块化的概念,以及如何在ES6和ES5中实现模块化,包括ES6模块化的基本用法、默认导出与混合导出、重命名export和import,以及ES6之前如何通过函数闭包和CommonJS规范实现模块化。
198 0
VUE学习四:前端模块化,ES6和ES5如何实现模块化
前端新机遇!为什么我建议学习鸿蒙?
【10月更文挑战第4天】前端新机遇!为什么我建议学习鸿蒙?
200 0
前端新机遇!为什么我建议学习鸿蒙?

热门文章

最新文章

  • 1
    【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    5
  • 2
    从前端视角聊聊通义灵码使用经验,如何更好地提升研发效率
    149
  • 3
    巧用通义灵码,提升前端研发效率
    15
  • 4
    详解智能编码在前端研发的创新应用
    8
  • 5
    VSCode AI提效工具,通义灵码前端开发体验
    25
  • 6
    智能编码在前端研发的创新应用
    8
  • 7
    大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
    7
  • 8
    课程预告|前端开发者如何用好通义灵码,这份实战指南请查收
    84
  • 9
    以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
    6
  • 10
    【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    4
  • AI助理

    你好,我是AI助理

    可以解答问题、推荐解决方案等