JavaScript知识架构学习路径(一)- 变量篇

【摘要】本文是专为JavaScript入门者而总结的,总体上将JavaScript的基础部分分成了九大块,分别是变量、运算符、数组、流程控制结构、字符串函数、函数基础、DOM操作基础、文档对象模型DOM和正则表达式。

【关键字】变量、运算符、数组、流程控制结构、函数、DOM、正则表达式。

本篇文章的主要内容是围绕着JavaScript(以后简称JS)的基础进行归纳与总结的,一方面可以给入门级的JS爱好者提供一个学习的路径,另一方面,也可以给稍有基础的JS学习者进行知识梳理用。

作为网页设计三层分离结构中的第三部分,JS的作用与地位毋庸置疑,然而,想系统化掌握JS的基础,为后续的高阶学习做好铺垫,还必须要对JS的基本内容有清晰的认识,所以,在此将JS的基础部分分为九大模块来进行归纳。

一、JS变量

对于变量而言,我们主要要从四个方面来掌握,具体包括命名、声明、类型和作用域,这四个方面在其他的编程语言中也一样存在,下面我们就具体来分别归纳:

1、命名

在变量的命名方面,我们需要了解命名的方法和命名的规则。i

(1)命名的方法

命名的方法在实际的项目中,我们通常会有两大类,一类是匈牙利命名法,这种命名法的写法是:变量名=类型+对象描述,例如我们要命名一个表单变量时,我们首先知道,该变量的类型是表单(form),同时,我们要知道这个表单的功能或含义,比如说这个表单是一个Switchboard,所以此时,我们对这个表单变量的命名应该为frmSwitchboard,这样,其他人在阅读你的代码时,就很容易理解了,当看到frm的时候,就知道你这个变量是一个表单变量了。

除了匈牙利命名法之外,另一类是驼峰命名法,这也是当前大多数项目中经常使用的命名方法,而驼峰命名法又分为大小写。如果全部是小写的命名,那么每两个单词之间是使用一个下划线“_”来连接的,例如:frm_switch_board;如果命名中大小写同时存在,此时,又将其分为大驼峰和小驼峰。大驼峰的命名是每个单词的首字母都是大写字母,例如:FrmSwitchBoard;而小驼峰的命名是第一个单词的首字母要小写,其后的单词的首字母都要大写,例如:frmSwitchBoard。

以上就是变量的命名方法,当前,国内主要采用的命名方法是小驼峰命名法。那么,我们在了解命名方法的同时,我们还必须同时掌握类型的问题,在JS中,类型主要有以下几种:

<1>Int类型 — i

<2>Float类型 — fl

<3>Boolean类型 — b

<4>String类型 — s

<5>Array数组 — a

<6>Object对象 — o

<7>Function函数 — fn

<8>Regular Expression正则 — re

我们在了解了类型之后,接下来我们再来看看变量命名的规则问题。

(2)命名的规则

我们之所以要了解变量的命名规则,目的是为了让我们命名的变量合法,也就是说可以正常使用。

在JS中,变量命名的规则一般需要遵循以下三条:

<1>变量名的首字符只能是英文字母或者下划线;

<2>变量名可以由英文字符、数字和下划线组成,不能包含其他的特殊字符,如@、!等字符;

<3>变量名不能是JS中的关键字或保留字。

2、声明

我们在完全理解并掌握了变量的命名之后,接下来我们来看看变量的声明问题。对于变量的声明,我们也需要把握好以下三个原则:

(1)JS中的变量通常是显式声明,例如:var 变量名;

(2)在声明变量时,我们切忌出现几个问题。其一,声明的变量没有数据类型;其二,重复声明变量;其三,隐式声明变量;其四,不声明而直接赋值。

而解决此类问题的一个最简单的办法就是先写变量声明符var,紧接着就写变量名,最后再直接给变量赋初值,例如:“var  i = 0;”  ;

(3)我们在声明变量时还需要养成一个好习惯,简单概括就十二个字:先声明、后读写、先赋值、后运算。

3、类型

对于变量而言,它其实可以分为两大类,一类是值类型,另一类是引用类型。

(1)值类型

对于值类型的变量,它具备以下几个特征:

<1>占用的存储空间是固定的;

<2>在保存与复制的时候,操作的是值本身;

<3>可以使用JS中的类型检测函数typeof()来检测其具体的类型;

(2)引用类型

而引用类型的变量,它也具备几个特征:

<1>变量占用的存储空间不是固定的;

<2>在保存与复制的时候,操作的是指向该变量的一个指针;

<3>可以通过instanceof()函数来检测其数据类型

同时,我们还需要了解的一个问题,那就是使用new()方法构造出的对象是属于引用类型的变量。

4、作用域

我们在了解了变量的命名、声明和类型之后,我们最后再来看看,在实际的项目中,我们所使用的变量的另外一个比较关键的问题,那就是变量的作用域。在此,我们首先根据变量的作用域,将变量划分为三级,具体是全局变量、局部变量和参数变量。

对于上述三级变量,我们分别从写法到调用,再到优先级最后再到特性等三个层次来总结。

(1)写法与调用

对于全局变量,它的写法要求我们在声明此变量的时候,要放在函数体的外部来进行声明,而调用的时候,可以在项目的任何位置进行;对于局部变量,它的写法要求我们必须在函数体的内部进行声明,而调用时,只能在函数体内部调用;再者,对于参数变量,它也是要求在函数声明的时候同时声明,而调用时,也必须出现在函数体的内部。

(2)优先级

在优先级方面,有三个参考的规则:

<1>同名的局部变量的优先级要高于全局变量;

<2>同名的参数变量的优先级也是高于全局变量;

<3>同名的局部变量的优先级高于参数变量。

(3)特性

对于变量的作用域,有以下一些特点:

<1>全局变量可以看作是全局对象的属性,而局部变量可以看作是调用对象的属性;

<2>内层函数可以访问外层函数的局部变量,但外层函数不能访问内层函数的局部变量;

<3>在变量的生命周期方面,全局变量除非被删除,否则将一直存在,局部变量则存活于自声明起到函数运行结束或者被删除之前。

以上内容就是我们在学习JavaScript时,对于变量方面需要掌握的知识点,希望能给大家带来参考。

摘自:这里

时间: 2024-10-24 22:21:26

JavaScript知识架构学习路径(一)- 变量篇的相关文章

JavaScript高级程序设计学习(三)之变量、作用域和内存问题

这次讲的主要是变量,作用域和内存问题. 任何一门编程语言,都涉及这三个. 变量,比如全局变量,局部变量等,作用域,也分全局作用域和方法作用域,内存问题,在java中就涉及到一个垃圾回收的问题,由于java中涉及到jvm,因此可以自动垃圾回收和内存分配,而不需要手动. 一.变量 每个变量都有其类型,数据类型.在java中分基本数据类型和引用数据类型,js同样如此. 面试题:java的基本数据类型有哪些,及其所占字节?引用类型有哪些? java基本数据类型分别为int(4),float(4),dou

javaScript知识体系(上)- 变量、语句、函数、对象

1. 变量 1.1 基本输出语句 console.log("在控制台输出的内容"); document.write("在文档中书写内容"); window.alert("其实是window的方法"); 1.2 代码注释 //行注释 /** * 这里可以对函数的功能进行说明 */ /*多行注释 多行注释 多行注释*/1.3 标签位置 1.4 标签属性 1 <script src="demo.js" type="t

JavaScript 学习笔记之最终篇

  JavaScript 的学习算是最后一篇了...把JS基础已经核心的部分彻底的进行了学习... 唯一的缺陷就是自己在运用上并不是特别的熟练...今天是JS的最后一章内容了..也是JS 中最常用的内容... 学习内容: JS外部类与内部类的使用 JS外部类和内部类,外部类是我们自己定义的类,其实重要的还是JS提供的内部类,就像JAVA中提供的API一样,JS也提供了一些常用的API 内部类分为静态类和动态类 静态类就是我们无需创建对象,可以直接调用其中的方法和变量 1.Math对象 <scri

学习IOS开问题篇--类中的成员变量如果不实例化是什么情况

@interface Person : NSObject @property (noatonmic,copy) NSString * name; @end 一个person类,name是person得成员变量 如果在一个类中写入person为成员变量 self.person.name = @"zhangsan"; 如果前面不将person实例化,实际上是在对一个空指针进行操作 [nil setname:@"zhangsan"]; 因为oc中对空指针发消息不会报错,所

Python之路【第二十四篇】:Python学习路径及练手项目合集

Python学习路径及练手项目合集 Wayne Shi· 2 个月前 参照:https://zhuanlan.zhihu.com/p/23561159 更多文章欢迎关注专栏:学习编程. 本系列Python技术路径中包含入门知识.Python基础.Web框架.基础项目.网络编程.数据与计算.综合项目七个模块.路径中的教程将带你逐步深入,学会如何使用 Python 实现一个博客,桌面词典,微信机器人或网络安全软件等.完成本路径的基础及项目练习,将具备独立的Python开发能力. 完整的Python学

JavaScript学习笔记——js变量的布尔值

typeof(1): numbertypeof(NaN): numbertypeof(Number.MIN_VALUE): numbertypeof(Infinity): numbertypeof("123"): stringtypeof(true): booleantypeof(window): objecttypeof(Array()): objecttypeof(function(){}): functiontypeof(document): objecttypeof(null)

javascript学习日记之变量的作用域

``` 很显然第一个弹出框并没有如我所想弹出的global而是undefined 这是为什么呢? 其实由于函数作用域特性 函数域始终优于全局域 同名的局部变量会覆盖掉全局变量 而第一次调用alert的时候scope还没正式定义 所以为undefined 以上代码可以理解为: ``` function f(){ var scope; alert(scope); var scope ="local"; alert(scope); }; f(); //等价与函数内变量的声明'提前'至函数体顶

【转载】前端学习路径

前端学习路径 什么是前端工程师? 总而言之前端工程师就是运用HTML/CSS/JavaScript等Web技术,在工作中配合设计师实现用户界面,和后端工程师进行数据对接,完成Web应用开发的职位. 开发工具 设计软件 前端工程师最首要的任务就是把设计师的设计图切好并翻译成代码,所以我们要学习一些设计软件的基础操作和切图方法. Photoshop 运用最广泛的设计软件,大部分人都在用它,很有必要学习一下 前端工程师必备的PS技能——切图篇 Sketch 轻量且功能强大,切图迅速高效,为UI设计而生

[转]大型 JavaScript 应用架构中的模式

目录 1.我是谁,以及我为什么写这个主题 2.可以用140个字概述这篇文章吗? 3.究竟什么是“大型”JavaScript应用程序? 4.让我们回顾一下当前的架构 5.想得长远一些 6.头脑风暴 7.架构提议 7.1 模块化理论 7.2 CommonJS模块 7.3 外观模式 7.4 中介者模式 7.5 应用外观 7.6 核心的抽象 7.7 整合 7.8 超越发布/订阅:自动注册事件 7.9 常见问题 13 August 2013 原文:Patterns For Large-Scale Java