例如这段 Vue 模板,我们通常就说它是声明式的
<div id="app">
<button @click="count++">
Count is: {{ count }}
</button>
</div>
除此之外,你可能还听说过 命令式,直接看代码吧
// app.html
<div id="app">
<button></button>
</div>
// app.js
let count = 0;
const btnElement = document.querySelector('#app button');
btnElement.textContent = `Count is: ${count}`
btnElement.addEventListener('click', () => {
count++;
btnElement.textContent = `Count is: ${count}`
});
把 声明式 和 命令式 对比起来看,你会发现 命令式 的语句通常是原生语句,而 声明式 都依赖于框架提供的特性。其实说白了,声明式 的代码 经过编译/框架运行时 解释后,也就是一句一句的 命令式 的代码了。
由此可以有一个简单的结论:声明式编程本身是一种理念,一种思想,而声明式的语法 往往是 某个框架 对 命令式 逻辑的上层抽象,以简洁的 语法 来表达原本繁琐的逻辑。
严格来说,状态 和 变量不是完全等价的,状态是变量的一个子集。通常我们把一个具备 可交互性 的变量称之为状态,什么叫 可交互性,看一个例子
如下逻辑中,count 没有参与页面交互,仅仅是内存中的一个值,对于用户来说是无感的,通常我们不会称之为状态
let count = 0;
for(let i = 0; i < 10; i++) {
count =+ 1;
}
但如果改写成这样,count 将渲染到页面上,并且按钮点击会递增其值,并重新渲染,这时 count 参与到了与用户的交互过程中,具备了可交互性,通常就可以称为 状态
let count = 0;
const btnElement = document.querySelector('#app button');
btnElement.textContent = `Count is: ${count}`
btnElement.addEventListener('click', () => {
count++;
btnElement.textContent = `Count is: ${count}`
});
对于 状态 的解释不仅限于以上的示例,比如平常业务开发中,决定一个 modal 是否显示的 变量visible 我们也会称为 状态,因为 visible 的变化会引起视图变更,此类参与 交互 但不会直接渲染到视图上的 变量,也属于此范畴。
来源:https://segmentfault.com/a/1190000043342237
当涉及到声明式的语言如CSS时,就发现了一些有趣的地方。声明式语言式必须符合对应格式的,而CSS选择器基本是由HTML结构决定的。对这种代码结构,我们能做的不多,这是否意味着CSS代码必须注释满天飞?
JS声明函数的三种方式:函数表达式: function操作符创建函数, 表达式可以存储在变量或者对象属性里. 往往被称为匿名函数, console.log(h.name); 可以看到打印为空;函数声明: 具名函数, 且函数能在其所在作用域的任意位置被调用
TypeScript和JavaScript一样,这是最简单的数据类型为boolean,也就是true和false。TypeScript和JavaScript一样,TypeScript里的所有数字都是浮点数
声明文件: 主要是解决JS 在TS使用问题。当我们引入JS文件(包括第三方库),声明文件就可以对编辑器进行类型检查和智能提示。关键字:declare,基础类型: 元组:tuple 数组 [] string number boolean enmu枚举
在说 const 关键字之前,大叔先和你唠唠大叔自己对 const 的感受 —— JavaScript 尼玛终于可以声明真正的常量啦!
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!