Vue.js的数据与方法

annwyna — Wed, 12 Aug 2020 16:06:32 +0800

当一个 Vue 实例被创建时，它将 data 对象中的所有的 property 加入到 Vue 的响应式系统中。当这些 property 的值发生改变时，视图将会产生“响应”，即匹配更新为新的值。

var data = { a : 1 }; var vm = new Vue({ el: '#app', data: data }) 需要注意的是，这里的“ data: data ”中我们没有像之前那样的“

Vue.js 组件

annwyna — Tue, 11 Aug 2020 21:57:35 +0800

Vue组件就是可复用的Vue实例，把经常使用的功能封装成组件然后在使用时能够更便捷。Vue.js使用Vue.component()函数来创建组件，Vue.component() 的第一个参数是组件的名称，第二个参数以对象的形式去描述一个组件。因为组件是可复用的Vue实例，所以它们与new Vue()接收相同的选项，例如data、 computed、watch、methods以及生命周期钩子等。仅有的例外是像el这样根实例特有的选项。

响应式布局与自适应式布局有什么不同

annwyna — Mon, 10 Aug 2020 14:49:05 +0800

很多人经常会对响应式布局和自适应式布局产生混淆，今天将为大家介绍这两者到底表示的是什么以及它们之间的区别。具有一定的参考作用，希望对大家有所帮助。一：什么是响应式布局和自适应式布局 1.什么是响应式布局响应式布局就是实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。换句话说就是一个网站能够兼容多个终端，而不是为了每一个终端做一个特定的版本。 2.什么是自适应式布局：自适应布局就是指能忘了使网页自适应的显示在不同大小终端设备上的新网页设计

JavaScript 原型对象和原型链理解

annwyna — Mon, 10 Aug 2020 11:09:19 +0800

一个例子让你彻底明白原型对象和原型链 1. 之前对js中的原型链和原型对象有所了解，每当别人问我什么是原型链和原型对象时，我总是用很官方（其实自己不懂）的解释去描述。有一句话说的好：如果你不能把一个很复杂的东西用最简单的话语描述出来，那就说明你没有真正的理解。最近正在读《Javascript高级程序设计》，书中对原型对象和原型链的描述让我受益匪浅，下面仅用一个对比性的例子来说明。我们经常会这么写 function Person () { this.name = 'John'; } var pers

JavaScript DOM编程艺术学习心得系列 ——（五）JavaScript语法之循环语句、函数、对象

annwyna — Sun, 09 Aug 2020 15:02:51 +0800

1. 循环语句 if 语句或许是最重要、最有用的条件语句了，他的唯一不足是无法完成重复性的操作。if 语句里，花括号中的代码块只能执行一次，如果你想多次执行，那就需要用到循环语句了。循环语句可以让我们反复多次地执行同一段代码。循环语句有几种不同的类型，但他们的工作原理几乎一样：只要给定的条件能够得到满足，包含在循环语句中的代码就将一直重复的执行，当给定条件的求值结果不再是 true 时，循环也就结束了。 1.1 while 循环 while 循环与 if 语句非常相似，它们的语法几乎完全一样，唯一的区别就

JavaScript DOM编程艺术学习心得系列 ——（四）JavaScript语法之操作、条件语句

annwyna — Sat, 08 Aug 2020 21:15:23 +0800

1. 操作之前给出的示例都非常简单，只是创建了一些不同类型的变量。要用 JavaScript 做一些有用的工作，还需要能够进行计算和处理数据。也就是需要完成一些操作（operation）。 1.1 算术操作符在 JavaScript 中加减乘除这些算术操作（arithmetic operation）都必须借助相应的操作符（operator），加（+）减（-）乘（*）除（/）。下面是操作的示例： 1+4 1+4*5 如果你怕产生歧义也可以用括号来提示优先级，像下面这样： (1+4)*5 1+(4*5)

JavaScript DOM编程艺术学习心得系列 ——（三）JavaScript语法之准备、语法

annwyna — Fri, 07 Aug 2020 22:58:04 +0800

在这一部分我们将简要复习一下JavaScript语法，并介绍其中最重要的一些概念。 1. 准备工作编写 JavaScript 脚本不需要任何特殊的软件，一个普通的文本编辑器和一个 Web浏览器就足够了。用 JavaScript 编写的代码必须通过 HTML/XHTML 文档才能执行。有两种方式可以做到这点。第一种方式是将 JavaScript 代码放到文档< head >标签中的< script >标签之间：

JavaScript DOM编程艺术学习心得系列 ——（二）DOM与浏览器战争

annwyna — Thu, 06 Aug 2020 23:17:27 +0800

DOM与浏览器战争继上一篇介绍过JavaScript 之后，我门要来看一看 DOM 和浏览器战争这块的事情了。这一部分完结之后，总结系列将要开始介绍复习一下 JavaScript 语法的部分了。 1.DOM 什么是 DOM ？文档对象模型，DOM 是一套对文档的内容进行抽象和概念化得方法。何为文档对象模型？可以举一个例子，“世界对象模型”即人们对现实世界的普遍的认识，只要每个人都有“世界对象模型”，那么当小A告诉小B“我中午吃的米饭”时，小B不会以为小A告诉他“你昨晚睡得地板”。“世界对象模型”可以用来描

JavaScript DOM编程艺术学习心得系列 ——（一）JavaScript起源

annwyna — Wed, 05 Aug 2020 19:33:19 +0800

今日，我在书中看到作者说“当网页设计人员谈论有关Web标准的话题时，HTML、CSS通常占据核心地位。”（看来俺是真弟弟啊T-T，我咋感觉关于JS的事更多那）但是W3C（万维网联盟）已批准另一项，所有与标准相兼容的Web浏览器都支持DOM（文档对象模型）。我们可以利用DOM给文档增加交互能力，就像用CSS给文档添加各种样式一样。因为依着作者所说“在开始学习DOM之前，我们先检视一下使网页具备交互能力的程序设计语言JavaScript。”所以我这个系列的开头才是JavaScript起源。 JavaScrip

JS垃圾回收机制

annwyna — Sat, 01 Aug 2020 18:36:29 +0800

JS垃圾回收机制 1.概述 JS的垃圾回收机制是为了以防内存泄漏，内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着。垃圾回收机制就是间歇的不定期的寻找到不再使用的变量，并释放掉它们所指向的内存。 C#、Java、JavaScript有自动垃圾回收机制，但C++和C没有。在JS中，JS的执行环境会负责管理代码执行过程中所使用的内存。 2.变量的生命周期当一个变量的生命周期结束之后它所指向的内存就应该被释放。JS有两种变量，全局变量和在函数中产生的局部变量。局部变量的生命周期在函数执行过后就结束了，此

JS运行机制详解（Event Loop）

annwyna — Thu, 30 Jul 2020 13:52:39 +0800

JS运行机制详解(Event Loop) 今天学习了一下关于JS的运行机制，在这里分享一下，顺便也加深一下自己的印象。 1.基础知识 js作为浏览器脚本语言，它的主要用途是与用户互动，以及操作DOM，因此js是单线程，也避免了同时操作同一个DOM的矛盾问题；为了利用多核CPU的计算能力，H5的Web Worker实现的“多线程”实际上指的是“多子线程”，完全受控于主线程，且不允许操作DOM； js引擎存在monitoring process进程，会持续不断的检查主线程执行栈是否为空，一旦为空，就会去Ev

annwyna的博客