javascript基础语法——全面理解变量和标识符


Posted in Javascript onJune 02, 2016

关于javascript,第一个比较重要的概念是变量,变量的工作机制是javascript的基本特性。实际上,变量是标识符的一种。本文将详细介绍变量和标识符

定义  

标识符(Identifier)就是一个名字,用来对变量、函数、属性、参数进行命名,或者用做某些循环语句中的跳转位置的标记

//变量
var Identifier = 123;
//属性
(new Object).Identifier = 'test';
//函数及参数
function IdentifierName(Identifier1){};
//跳转标记
Identifier:
for(var i = 0; i < 5; i++){
  if(i == 3){
    break Identifier;
  }
}

在日常生活中,有些东西是固定不变的,有些东西则会发生变化。例如,人的姓名和生日是固定不变的,但心情和年龄却会随着时间变化而变化。人们把那些会发生变化的东西称为变量

当程序需要将值保存起来以备将来使用时,便将其赋值给一个变量。变量(variable)是一个用于保存值的占位符,可以通过变量名称来获得对值的引用

 javascript基础语法——全面理解变量和标识符

命名规则  

在词法结构一文中,我们介绍到javascript是一门区分字母大小写的语言,且和其他任何编程语言一样,javascript保留了一些标识符为自己所用,保留字不能用做普通的标识符

[注意]保留字包括关键字、未来保留字、空字面量和布尔值字面量

保留字 ReservedWord ::
  Keyword
  FutureReservedWord
  NullLiteral
  BooleanLiteral

javascript标识符名允许包含字母、数字、美元符号和下划线(但第一个字符不允许是数字)

//错误示范
 6num //开头不能用数字
 %sum //开头不能用除(_ $)外特殊符号,如(% + /等)
 sum+num //开头中间不能使用除(_ $)外特殊符号,如(% + /等)

javascript允许标识符中出现 Unicode字符全集中的字母和数字(包括中文)。因此,程序员也可以使用非英语语言或数学符号来书写标识符

var 测试文字 = 'test';

[注意]出于可移植性和易于书写的考虑,通常我们不使用扩展的ASCII或Unicode字符

通常驼峰格式是标识符命名的首选格式,第一个字母小写,剩下的每个单词的首字母大写

var myMoodToday = 'happy';

对于不同的数据类型,javascript有约定俗成的标识符名命名规则

类型          前缀      示例    
数组(Array)       a     
  aItems
布尔值(Boolean)  
  b     
  bIsComplete
浮点数(Float)  
   f 
 
  fPrice
函数(Function)
     fn    
  fnHandler
整数(Integer) 
     i 
 
  iItemCount
对象(Object) 

   o 
 
  oDIv1
正则表达式(RegExp)    re    
  reEmailCheck
字符串(String) 
    s 
 
  sUserName
变量()Variant
      v 
 
  vAnything

变量声明

声明

在javascript中,使用一个变量之前应当先声明(declare),变量是使用关键字var(variable的缩写)来声明的

var i;
var sum;

也可以通过一个var关键字来声明多个变量

var i ,sum;

赋值

把值存入变量的操作称为赋值(assignment)。一个变量被赋值以后,我们就说该变量包含这个值

给变量第一次赋值的过程,叫初始化

我们可以将变量的初始赋值和变量声明合写在一起

var message = 'hello';
var i=0,j=0,k=0;

如果未在var声明语句中给变量指定初始值,那么虽然声明了这个变量,但在给它存入一个值之前,它的初始值就是undefined

javascript基础语法——全面理解变量和标识符

在for循环和for-in循环中同样可以使用var语句,这样可以更简洁地声明在循环语法内中使用的循环变量

for(var i=0; i<10; i++)console.log(i);

变量可以在声明时赋值,但不能有其他操作,如+=、-=等

var a = 2;//是正确的
var a += 2;//是错误的
var a = 2++;//是错误的,++只能用于变量,不能用于常量

重复声明

使用var语句重复声明变量是合法且无害的,如果重复声明且带有赋值操作,相当于重新赋值

javascript基础语法——全面理解变量和标识符

遗漏声明

如果试图读取一个没有声明的变量的值,javascript会报错

javascript基础语法——全面理解变量和标识符

javascript允许遗漏声明,即直接对变量赋值而无需事先声明,赋值操作将自动声明该变量

javascript基础语法——全面理解变量和标识符

但是,在ECMAScript5严格模式中,给一个没有声明的变量赋值会报错

<script>
'use strict';
a = 5;
console.log(a);
</script>
javascript基础语法——全面理解变量和标识符

变量特性  

javascript变量是弱类型(也叫松散类型)的,所谓松散类型就是可以用来保存任何类型的数据

编程语言分类动态类型语言和静态类型语言两种。 动态类型语言是指在运行期间才去做数据类型检查的语言,也就是说,在用动态类型的语言编程时,不用给任何变量指定数据类型,该语言会在第一次赋值给变量时,在内部将数据类型记录下来。javascript就是动态类型语言的代表。

在javascript中,可以在修改变量值的同时修改值的类型

var message = 'hi';
message = 100;//有效,但不推荐

变量松散类型的特性总结起来有两点:一是声明时不用给变量指定数据类型;二是赋值时可以修改数据类型

变量作用域

变量的作用域(scope),又叫执行环境(execution context),是程序源代码中定义这个变量的区域

作用域分为全局作用域和函数作用域(又叫局部作用域)两种

全局作用域是最外围的一个执行环境,在web浏览器中,全局执行环境被认为是window对象。所有全局变量和函数都是作为window对象的属性和方法创建的。全局变量拥有全局作用域,在javascript代码中的任何地方都是有定义的。全局作用域直到应用程序退出例如关闭网页或浏览器时才会被销毁

在函数内声明的变量只在函数体内有定义。它们是局部变量,作用域是局部性的。函数参数也是局部变量,它们只在函数体内有定义。函数作用域中的所有代码执行完毕后,该作用域被销毁,保存在其中的所有变量和函数定义也随之销毁

function test(){
  var message = 'hi';
}
test();
alert(message);//错误

如果省略var操作符,则会创建一个全局变量

function test(){
  message = 'hi';
}
test();
alert(message);//'hi'

虽然省略var操作符可以定义全局变量,但并不推荐。在局部作用域中定义的全局变量很难维护,而且如果有意地忽略了var操作符,也会由于相应变量不会马上就有定义而导致不必要的混乱,给未经声明的变量赋值在严格模式下会导致抛出ReferenceError错误

在函数体内,局部变量的优先级高于同名的全局变量,如果在函数内声明的一个局部变量或者函数参数中带有的变量和全局变量重名,那么全局变量就被局部变量遮盖

var scope = 'global';
function checkscope(){
  var scope = 'local';
  return scope;
};
checkscope();//'local'

声明提升(hoisting)

块级作用域

块级作用域是指花括号内的每一段代码都具有各自的作用域,而javascript没有块级作用域。javascript只有函数作用域:变量在声明它们的函数体以及这个函数体嵌套的任意函数体内都是有定义的

这意味着,变量在声明之前甚至已经可用。javascript这个特性被非正式地称为声明提升(hoisting),javascript函数里声明的所有变量(不涉及赋值)都被提前到函数体的顶部

[注意]其实除了变量提升,函数也被提升,到函数部分会有详细介绍

var scope = 'global';
function f(){
  console.log(scope);//undefined
  var scope = 'local';
  console.log(scope);//'local'
}
//变量声明提升之后,相当于下面代码
var scope = 'global';
function f(){
  var scope;
  console.log(scope);//undefined
  scope = 'local';
  console.log(scope);//'local'
}

javascript中没有块级作用域,所以一些程序员特意将变量声明放在函数体顶部,这种源代码非常清晰地反映了真实的变量作用域

属性变量

当声明一个javascript全局变量时,实际上是定义了全局对象window的一个属性

当使用var声明一个变量时,创建的这个变量是不可配置的,也就是说这个变量无法通过delete运算符删除

var truevar = 1;
console.log(truevar,window.truevar);//1 1
delete truevar;//false
console.log(truevar,window.truevar);//1 1

如果没有使用严格模式并给一个未声明的变量赋值的话,javascript会自动创建一个全局变量,以这种方式创建的变量是全局对象的正常的可配置属性,并可以删除它们

window.fakevar1 = 10;
console.log(fakevar1,window.fakevar1);//10 10 
this.fakevar2 = 20;
console.log(fakevar2,window.fakevar2); //20 20
fakevar = 30;
console.log(fakevar,window.fakevar); //30 30

delete window.fakevar1;//true
delete this.fakevar2;//true
delete fakevar;//true

console.log(fakevar1,window.fakevar1);//报错
console.log(fakevar2,window.fakevar2); //报错
console.log(fakevar,window.fakevar); //报错

javascript全局变量是全局对象的属性,这是在ECMAScript中强制 规定的。局部变量当做跟函数调用相关的某个对象的属性。ECMAScript3称为调用对象(call object),ECMAScript5称为声明上下文对象(declarative environment record)。javascript允许使用this关键字来引用全局对象,却没有办法可以引用局部变量中存放的对象。这种存放局部变量对象的特有性质,是一种对我们不可见的内部实现

以上这篇javascript基础语法——全面理解变量和标识符就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
零基础学JavaScript最新动画教程+iso光盘下载
Jan 22 Javascript
JQuery,Extjs,YUI,Prototype,Dojo 等JS框架的区别和应用场景简述
Apr 15 Javascript
JS 日期比较大小的简单实例
Jan 13 Javascript
JavaScript用JQuery呼叫Server端方法示例代码
Sep 03 Javascript
Backbone.js的一些使用技巧
Jul 01 Javascript
JavaScript类型检测之typeof 和 instanceof 的缺陷与优化
Jan 13 Javascript
JavaScript实现图片自动加载的瀑布流效果
Apr 11 Javascript
vue 获取及修改store.js里的公共变量实例
Nov 06 Javascript
React实现轮播效果
Aug 25 Javascript
使用js和canvas实现时钟效果
Sep 08 Javascript
实用的 vue tags 创建缓存导航的过程实现
Dec 03 Vue.js
javascript实现拼图游戏
Jan 29 Javascript
Bootstrap开发实战之第一次接触Bootstrap
Jun 02 #Javascript
jQuery实现图片轮播效果代码(基于jquery.pack.js插件)
Jun 02 #Javascript
深入理解Ajax的get和post请求
Jun 02 #Javascript
JS小数运算出现多为小数问题的解决方法
Jun 02 #Javascript
jQuery easyUI datagrid 增加求和统计行的实现代码
Jun 01 #Javascript
jQuery 选择同时包含两个class的元素的实现方法
Jun 01 #Javascript
jquery ezUI 双击行记录弹窗查看明细的实现方法
Jun 01 #Javascript
You might like
PHP 基于文件头的文件类型验证类函数
2012/05/01 PHP
PHP之sprintf函数用法详解
2014/11/12 PHP
自制PHP框架之设计模式
2017/05/07 PHP
jquery提示 &quot;object expected&quot;的解决方法
2009/12/13 Javascript
40款非常棒的jQuery 插件和制作教程(系列二)
2011/11/02 Javascript
探索Emberjs制作一个简单的Todo应用
2012/11/07 Javascript
NodeJS url验证(url-valid)的使用方法
2013/11/18 NodeJs
JavaScript严格模式禁用With语句的原因
2014/10/20 Javascript
Vuejs第八篇之Vuejs组件的定义实例解析
2016/09/05 Javascript
CSS3+JavaScript实现翻页幻灯片效果
2017/06/28 Javascript
Node.js  REPL (交互式解释器)实例详解
2017/08/06 Javascript
基于vue-simplemde实现图片拖拽、粘贴功能
2018/04/12 Javascript
详解JS中统计函数执行次数与执行时间
2018/09/04 Javascript
Vue性能优化的方法
2020/07/30 Javascript
js实现简单图片拖拽效果
2021/02/22 Javascript
web.py在模板中输出美元符号的方法
2014/08/26 Python
python中__slots__用法实例
2015/06/04 Python
Python简单调用MySQL存储过程并获得返回值的方法
2015/07/20 Python
教你用Python脚本快速为iOS10生成图标和截屏
2016/09/22 Python
Python中列表与元组的乘法操作示例
2018/02/10 Python
Python lxml解析HTML并用xpath获取元素的方法
2019/01/02 Python
Python qrcode 生成一个二维码的实例详解
2020/02/12 Python
基于python实现复制文件并重命名
2020/09/16 Python
使用CSS3代码绘制可爱的Hello Kitty猫
2016/08/03 HTML / CSS
Rentalcars.com中国:世界上最大的在线汽车租赁服务
2019/08/22 全球购物
创建索引时需要注意的事项
2013/05/13 面试题
Linux如何压缩可执行文件
2013/10/21 面试题
女娲补天教学反思
2014/02/05 职场文书
有关爱国演讲稿
2014/05/07 职场文书
小学生保护环境倡议书
2014/05/15 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
计算机科学与技术专业求职信
2014/09/03 职场文书
行政助理岗位职责范本
2015/04/11 职场文书
老员工辞职信范文
2015/05/12 职场文书
个人催款函范文
2015/06/23 职场文书
Python3 如何开启自带http服务
2021/05/18 Python