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 ...
随机推荐
- 【Solution】API测试工具,访问方式
1. post的时候,@requestBody 用 json的传递方式
- JavaScript 的if语句和==的判断
一. if(xx)的判断 JavaScript 遇到预期为布尔值的地方(比如if语句的条件部分),就会将非布尔值的参数自动转换为布尔值.系统内部会自动调用Boolean函数. 1.当if括号里面的表达 ...
- 从零开始一起学习SLAM | 掌握g2o顶点编程套路
点"计算机视觉life"关注,置顶更快接收消息! ## 小白:师兄,上一次将的g2o框架<从零开始一起学习SLAM | 理解图优化,一步步带你看懂g2o代码>真的很清晰 ...
- 我的第三篇博客(激动激动真激动!!!)A-B Problem
#210. 差(A-B problem) 题目描述 楠楠在网上刷题,感觉第一题:求两数的和(A+B Problem)太无聊了,于是增加了一题:A-B Problem,难倒了一群小朋友,哈哈. 题目是这 ...
- 用html5实现音频播放器
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- python中pip升级
第一步: 首先安装python,在百度中搜索python,进入python官网,点击downliad, 下载到本地: 下载好后进行安装,与一般软件安装过程一样.安装过程中要注意勾线Add python ...
- 重装@angular/cli reason: write EPROTO 139955972261696:error:1408F10B:SSL routines:ssl3_get_record:wrong version number:../deps/openssl/openssl/ssl/record/ssl3_record.c:252:
前几天不小心卸载了 angular@cli,然后重装的时候发现,一直报错.如下: ××××××××@××××ln622653:/$ npm install -g @angular/clinpm ERR ...
- Vue系列之 => webpack处理样式文件
处理css文件 安装 npm i style-loader css-loader -D main.js import $ from 'jquery' //Es6中导入模块的方式 import './c ...
- 菜鸟初学redis(二)
如果你的redis可以在myeclipse上运行小demo了,那么可以继续学习了 redis Java String 实例 string是redis最基本的类型,一个key对应一个value. str ...
- Cannot locate BeanDefinitionParser for element [scoped-proxy]
指定使用 CGLIB 而不使用 JDK 生成代理对象:注意:此两个标签必须同时出现,不然会报:Cannot locate BeanDefinitionParser for element [scope ...