JS 基本类型和引用类型---JS 学习笔记(一)
本文参考了focusxxxxy的博客,感谢他的知识分享。
一 基本类型和引用类型的值
ECMAScript 变量包含两种不同数据类型的值:基本类型和引用类型。
也有其他的叫法,比如原始类型和对象类型,拥有方法的类型和不能拥有方法的类型,还可以分为可变类型和不可变类型,其实这些叫法都是依据这两种的类型特点来命名的,大家爱叫啥就叫啥吧 。 ------------focusxxxxy的博客
基本类型:简单的数据段,undefined、boolean、number 和 string ,他们都是按值访问的,因为可以操作保存在变量中的实际值。
基本类型的特点:
1. 基本类型的比较是值的比较
但是在比较的时候注意运算符 == 和 === 的区别。== 默认会把两边不同的数据类型转换城相同的数据类型,再进行值的比较。而 === 会先比较数据类型,若数据类型不一样,就会返回 false。举一些例子:
var a = 1;
var b = '1'; console.log(a == b); // true 想转成相同的格式,再比较
console.log(a === b); // false 不转格式直接比较 var c = true
console.log(a == c); // true
console.log(a ===c); // false
2. 基本类型的变量存放在栈内存(栈区)里面
var name = 'Jhon';
var city = 'Beijing';
var age = 27;
那么他的存储结构如下图:栈内存包含了变量名和变量值。

引用类型:除了上面的基本类型(number,string,boolean,null,undefined)之外就是引用类型了,也可以说是就是对象(对象,数组,函数和 null)了。对象是属性和方法的集合。也就是说引用类型可以拥有属性和方法,属性又可以包含基本类型和引用类型。来看看引用类型的一些特性:
1. 引用类型的属性和方法是可以变化的,也就是可以增删改查。这个很好理解,无需多说。但是要注意有很多方法,注意总结归纳
2. 引用类型的内容是同是保存在栈内存和堆内存中的对象。(什么是栈内存和堆内存呢?后续需要查询资料)
javascript和其他语言不同,其不允许直接访问内存中的位置,也就是说不能直接操作对象的内存空间,我们是操作对象的引用,所以引用类型的值是按引用访问的。准确地说,引用类型的存储需要内存的栈内存和堆内存共同完成,栈区内存保存变量标识符和指向堆内存中该对象的指针,也可以说是该对象在堆内存的地址。假如有以下几个对象:
person1 = {name : 'Jhon'};
person2 = {name : 'Marry'};
person2 = {name : 'Lily'};
那么,他们的存储结构如下图:

3. 引用类型的比较:
var person1 = "{}"
var person2 = "{}"
console.log(person1 == person2) // true 这里比较的是字符串
var person1 = {}
var person2 = {}
console.log(person1 == person2) // false 这里比较的是 person1 和 person2 里面的内存地址。内存地址不一样,返回值就是 false
引用类型时按引用访问的,换句话说就是比较两个对象的堆内存中的地址是否相同,那很明显,person1 和 person2 在堆内存中地址是不同的:

二 基本类型和引用类型在复制变量值的区别
基本类型复制:从一个变量到了另一个变量复制基本类型的值,会在这个变量对象创建一个新的值,载把这个值复制到为新变量分配的位置上。如下面的例子:
var num1 = 5;
var num2 = num1;
num2 = num2 + 1; console.log(num1); // 5
console.log(num2); // 6 将 num1 的值赋值给 num2 以后,两个变量之间相互不影响。改变一个变量的值不会改变另外一个。但是引用变量的复制就不同了,会相互改变。
引用类型复制:从一个变量到了另一个变量复制引用类型的值,同样也会将存储在变量对象中的值复制一份放到为新变量分配的空间中。不同的是,这个复制的值实际上是一个指针,而这个指针指向的是堆内存中的一个对象。复制结束后,两个变量引用的是同一个对象。这样的后果是,如果对变量1进行修改,那么变量2的内容也会跟着改变。如下面的例子:
var person1 = new Object(); // 为 person1 创建一个新的空对象
var person2 = person1; // 将 person1 的堆内存地址复制一份,给 person2
person1.name = 'Jhon'; // 为 person1 指向的对象添加 name 属性
console.log(person2.name); // person2 的 name 属性返回 Jhon (person2 和 person1 指向同一个对象。通过 person1 对对象进行改变,调用 person2 时也会看到改变)
ECMAScript 中所有函数的参数都是按值传递的。
三 检测基本类型和引用类型的方法
基本类型检测方法:用 typeof 操作符。他可以确定一个变量是 字符串、数字、布尔值还是 undefined。但是却区分不出来一个变量是 null 还是 object。例如:
注意,function 是引用类型,但是 typeof 却能区分出是不是 function。
var a = 'Jhon';
var b = true;
var c ;
var d = null;
var e = new Object(); console.log(typeof a); // string
console.log(typeof b); // boolean
console.log(typeof c); // undefined
console.log(typeof d); // object
console.log(typeof e); // object
引用类型检测方法:用 instanceof 操作符。例如:
var o = new Object(); console.log(o instanceof Object); // true
JS 基本类型和引用类型---JS 学习笔记(一)的更多相关文章
- JS基本类型和引用类型的值
JS中可以把变量分成两部分,基本类型和引用类型. 基本类型比较简单,包括:Undefined.Null.Boolean.Number和String,基本类型值就是简单的数据段:引用类型值可能由多个值构 ...
- js基本类型和引用类型
先来两个例题 //1. var person; person.age=10; console.log(person.age) //undefined person是字符串而不是对象,没有属性 //2. ...
- Js 基本类型和引用类型
一个变量可以存放两种类型的值,基本类型的值(primitive values)和引用类型的值(reference values). ES6 引入了一种新的原始数据类型 Symbol,表示独一无二的值. ...
- Js基础---红宝书读书日记(1)-------基本类型和引用类型
JS的变量可能包含两种不同数据类型的值,基本类型和引用类型; 基本类型是指简单的数据段,引用类型是指可能由多个值构成的对象; JS高级程序设计第三章介绍了变量分为 5种简单数据类型(string/nu ...
- 《JavaScript高级程序设计》读书笔记 ---基本类型和引用类型的值
变量.作用域和内存问题 基本类型和引用类型的值ECMAScript 变量可能包含两种不同数据类型的值:基本类型值和引用类型值.基本类型值指的是简单的数据段,而引用类型值指那些可能由多个值构成的对象.在 ...
- Java Native Interface 二 JNI中对Java基本类型和引用类型的处理
本文是<The Java Native Interface Programmer's Guide and Specification>读书笔记 Java编程里会使用到两种类型:基本类型(如 ...
- javascript的基本类型和引用类型
一.基本类型和引用类型 基本的数据类型有5个:undefined,boolean,number,string,null ? 1 2 3 4 5 typeof null; //"object& ...
- javascript中基本类型和引用类型的区别分析
大多数人系统学习过的程序设计语言,在这些语言的学习过程中最早学到的几个要点之一就是值类型和引用类型的区别.下面我们来看一下在 JavaScript 中基本数据类型(Primitive Types)和引 ...
- 基本类型和引用类型调用是的区别(Object.create)
var person = { name : 'jim', address:{ province:'浙', city:'A' } } var newPerson = Object.create(pers ...
随机推荐
- .NET 内存分配笔记
阅读博客http://jonskeet.uk/csharp/memory.html的笔记(个人水平有限,如若翻译.记录有误,请提,谢谢~) 误区:引用类型保持在堆中,值类型保持在栈中. 问题:前半句正 ...
- Go 初体验 - 错误与异常处理
错误处理是学习任何编程语言都需要考虑的一个重要话题 go 内置的 error 接口是这样的: 先上代码: 输出: 释义: 我们首先定义9行的自定义错误类型 30行再实现 error 接口 34定义打开 ...
- Python 写了个小程序,耗时一天,结果才100多行
from selenium import webdriver import selenium.webdriver.support.ui as ui from selenium.webdriver.co ...
- java操作Maven
记录瞬间 import org.dom4j.Document; import org.dom4j.DocumentException; import org.dom4j.Element; import ...
- sql 查询所有表以及表结构
查询数据库中所有的表: as statu from [sysobjects] where [type] = 'u' order by [name] 查询表结构: --查询表结构 ALTER PROCE ...
- 理解linux网络管理命令
linux 管理命令,iproute 查看帮助文件: man ip 以下为常用帮助文件. SEE ALSO ip-address(), ip-addrlabel(), ip-l2tp(), ip-li ...
- djanggo中自定义过滤器的步骤图解
- jQuery常见用法
jQuery有好多版本本,无法同时引用两个不同的版本,容易造成混乱,用哪一个,调用哪一个.\ jQuery引用到<head></head>中,页面加载时就需要特效调用这些方法. ...
- 中文编码错误,Error output could not be translated from the native locale to UTF-8.
假如使用http访问仓库,用户配置的pre-commit钩子里面如果有中文,可能会出现"Error output could not be translated from the nativ ...
- DUILIB消息处理过程
DUILIB消息处理机制 方法一. 首先窗口基类创建 CWindowWnd->Create() 调用 CWindowWnd->RegisterWindowClass() 注册 CWindo ...