详解JavaScript的变量


Posted in Javascript onApril 04, 2019

基本类型和引用类型的值

ECMAScript变量一般有两种数据类型的值:基本类型和引用类型。

  1. 基本类型: 简单的数据段:Undefined, Null, Boolean, Number, String
  2. 引用类型:多个值构成的对象;

1.动态的属性

定义两者的值:创建一个变量并为其变量赋值;

执行两者的值:

  1. 引用类型:可以添加、删除属性和方法;
  2. 基本类型:不能添加、删除属性和方法;

比如:引用类型 a,可以添加属性 name age

var a = new Object();
a.name = "我喂前端袋盐";
a.age = 24;
console.log(a.name);   //我喂前端袋盐

 基本类型 name 无法添加属性 age

var name = "我喂前端袋盐";
name.age = 24;
console.log(name.age);   //undefined

代码中可知:只能给引用类型值动态地添加属性,以便将来使用。

2. 赋值变量值

从一个变量向另一个变量复制基本类型值和引用类型值时:
基本类型:在变量对象上创建一个新值,并将其值复制给新变量分配的位置上;(完全独立的两个变量)
例如

var a = 111;
 var b = a;
 console.log(b);   //111

代码中可知:变量b的值只是变量a的值的一个副本,两者的值111是完全独立的。
引用类型:将存储在变量对象中的值复制一份放到为新变量分配的空间中;(引用同一个对象的两个变量)
引用类型的值的副本实际是一个指针,指向存储在堆中的一个对象。

var obj1 = new Object;
var obj2 = obj1;
obj1.name = "我喂前端袋盐";
console.log(obj2,name);   // Object { name="我喂前端袋盐"} 我喂前端袋盐

代码中可知:obj1和obj2都指向同一个对象Object;所以,为obj1添加的name属性,通过obj2也可以访问的到。

3. 传递参数

我们都知道基本类型是按值访问的,因为可以访问保存在变量中的实际的值。

所有函数的参数都是按值传递的。
基本类型:基本类型值的传递如同基本类型变量的复制一样;
在向参数传递值,被传递的值会被复制给一个局部变量(命名参数),因此这个局部变量的变化不会反映在函数的外部。
例如:

function fn(num) {
 num += 10;
 return num;
}
var a = 10;
var result = fn(a);
console.log(result); //20
console.log(a);  //10

代码中可知:参数num和变量a互不相识,只是有着相同的值而已,用完之后,你还是你,我还是我,互不干政。
引用类型:引用类型的传递如同引用类型变量的复制一样;
在向参数传递值时,会把这个值在内存中的地址复制给一个局部变量,因此这个局部变量的变化会反映在函数的外部。
例如:

function fn(obj) {
 obj.name = '我喂前端袋盐';
}
var person = new Object();
fn(person);
console.log(person.name);  //我喂前端袋盐

代码中可知:在这个函数内部,参数obj和变量person引用的是同一个对象Object,所以,你不动我也不动,你动我也动,你中有我,我中有你,情义绵绵,经久不息……
也就是说:即使变量person是按值传递的,但是参数obj(想象成局部变量)还是会按引用来访问同一个对象。
访问变量有按值和按引用两种方式,参数只能按值传递。

4. 检测类型

基本类型:typeof
引用类型:instanceof(对象或null)
例如:

var a = 'Wo Wei Qian Duan Dai Yan';
var b = 24;
var c = '';
var d = true;
var e;
var g = undefined;
var f = null; // 比较特殊
var h = new Object();
 
console.log(typeof a); //string
console.log(typeof b); //number 
console.log(typeof c); //string
console.log(typeof d); //boolean
console.log(typeof e); //undefined
console.log(typeof g); //undefined
console.log(typeof f); //object
console.log(typeof h); //object

所用引用类型的值都是Object的实例。
如下:

var person = new Object();
var num = [1,2, 3];
var pattern = /.at/i;
console.log(person instanceof Object); //true
console.log(num instanceof Object); //true
console.log(num instanceof Array);  //true
console.log(pattern instanceof Object); //true
console.log(pattern instanceof RegExp); //true

以上所述是小编给大家介绍的JavaScript变量详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
小议Function.apply() 之一------(函数的劫持与对象的复制)
Nov 30 Javascript
鼠标移动到图片名上,显示图片的简单实例
Jul 14 Javascript
JS防止用户多次提交的简单代码
Aug 01 Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
Sep 22 Javascript
eclipse导入jquery包后报错的解决方法
Feb 17 Javascript
jquery实现弹出div,始终显示在屏幕正中间的简单实例
Mar 08 Javascript
微信小程序-图片、录音、音频播放、音乐播放、视频、文件代码实例
Nov 22 Javascript
Bootstrap 树控件使用经验分享(图文解说)
Nov 06 Javascript
jQuery实现带3D切割效果的轮播图功能示例【附源码下载】
Apr 04 jQuery
layui 实现加载动画以及非真实加载进度的方法
Sep 23 Javascript
javascript实现点击星星小游戏
Dec 24 Javascript
详解微信小程序中var、let、const用法与区别
Jan 11 Javascript
vue elementUI table表格数据 滚动懒加载的实现方法
Apr 04 #Javascript
js 计算图片内点个数的示例代码
Apr 04 #Javascript
在node中使用jwt签发与验证token的方法
Apr 03 #Javascript
全面了解JavaScript的作用域链
Apr 03 #Javascript
从理论角度讨论JavaScript闭包
Apr 03 #Javascript
Node.js+Express+Mysql 实现增删改查
Apr 03 #Javascript
微信小程序配置服务器提示验证token失败的解决方法
Apr 03 #Javascript
You might like
《PHP编程最快明白》第七讲:php图片验证码与缩略图
2010/11/01 PHP
php设计模式 Builder(建造者模式)
2011/06/26 PHP
PHP中Session可能会引起并发问题
2015/06/26 PHP
PHP超全局数组(Superglobals)介绍
2015/07/01 PHP
javascript页面渲染速度测试脚本分享
2014/04/15 Javascript
JQuery遍历json数组的3种方法
2014/11/08 Javascript
javascript中CheckBox全选终极方案
2015/05/20 Javascript
基于jquery实现省市联动特效
2015/12/17 Javascript
jQuery异步提交表单的两种方式
2016/09/13 Javascript
浅谈js内置对象Math的属性和方法(推荐)
2016/09/19 Javascript
关于JS Lodop打印插件打印Bootstrap样式错乱问题的解决方案
2016/12/23 Javascript
Vue 页面跳转不用router-link的实现代码
2018/04/12 Javascript
jQuery实现的简单拖拽功能示例【测试可用】
2018/08/14 jQuery
jQuery实现基本隐藏与显示效果的方法详解
2018/09/05 jQuery
vue实现文字加密功能
2019/09/27 Javascript
jquery更改元素属性attr()方法操作示例
2020/05/22 jQuery
[01:03:31]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第二局
2016/02/26 DOTA
python 正则式 概述及常用字符
2009/05/07 Python
python实现的DES加密算法和3DES加密算法实例
2015/06/03 Python
python编码总结(编码类型、格式、转码)
2016/07/01 Python
python aiohttp的使用详解
2019/06/20 Python
详解在Python中以绝对路径或者相对路径导入文件的方法
2019/08/30 Python
Windows下pycharm创建Django 项目(虚拟环境)过程解析
2019/09/16 Python
Python基于read(size)方法读取超大文件
2020/03/12 Python
美国高端婴童品牌:Hanna Andersson
2016/10/30 全球购物
周仰杰(JIMMY CHOO)英国官方网站:闻名世界的鞋子品牌
2018/10/28 全球购物
小学生获奖感言范文
2014/02/02 职场文书
大堂副理的岗位职责范文
2014/02/17 职场文书
超市客服工作职责
2014/06/11 职场文书
青奥会口号
2014/06/12 职场文书
护理专业求职信
2014/06/15 职场文书
纪律教育月活动总结
2014/08/26 职场文书
幼儿园园长安全责任书
2015/05/08 职场文书
人间正道是沧桑观后感
2015/06/15 职场文书
大学生受助感言
2015/08/01 职场文书
CSS 实现Chrome标签栏的技巧
2021/08/04 HTML / CSS