您的位置：首页 > Web前端 > JavaScript

说说 JavaScript 基本类型值与引用类型值

2017-02-14 15:40 411 查看
基本类型的值指的是简单数据段。

引用类型的值是由多个值构成的对象。

基本数据类型是按值访问的，即操作的是变量中实际的值。

引用类型是按引用访问的，即操作的是变量对象的引用。

1 动态属性

对于引用类型的值，可以为它添加、改变或删除其属性和方法：

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>可以给引用类型值动态地添加属性</title>
</head>
<body>

<script type="text/javascript">
var person = new Object();
person.name = "deniro";
console.log(person.name);//deniro
</script>
</body>
</html>


不能给基本类型的值添加属性，虽然不会报错，但没什么用：

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>不能给基本类型动态地添加属性</title>
</head>
<body>

<script type="text/javascript">
var person = "deniro";
person.age = 22;
console.log(person.age);//undefined
</script>
</body>
</html>


2 复制变量的值

复制基本类型的值，会在变量对象上创建一个新值，然后把该值复制到为新变量所分配的位置上：

var num1 = 5;
var num2 = num1;




复制引用类型的值时，也会复制一份放到为新变量分配的空间中，但复制的是指针。实际上这两个变量将引用同一个对象，即改变其中一个变量，就会影响另一个变量。

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>复制引用类型的值时，生成的新变量与原来的变量，实际上是引用同一个对象</title>
</head>
<body>

<script type="text/javascript">
var obj1 = new Object();
var obj2 = obj1;
obj1.name = "deniro";
console.log(obj2.name);//"deniro"
</script>
</body>
</html>




3 传递参数

所有函数的参数都是按值传递的。

在向参数传递基本类型的值时，被传递的值会被复制给一个局部变量：

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>向函数传递基本类型的值时，被传递的值会被复制给局部变量</title>
</head>
<body>

<script type="text/javascript">
function addTen(num){
num += 10;
return num;
}

var count = 20;
var result = addTen(count);
console.log(count);//20；不变
console.log(result);//30
</script>
</body>
</html>


在向参数传递引用类型的值时，会把这个值在内存中地址复制给局部变量，因此这个局部变量的变化会反映在函数外部：

function setName(obj){
obj.name = "deniro";
}

var person = new Object();
setName(person);
console.log(person.name);//deniro


以下例子说明了即使函数中的参数类型是对象时，也是按照值进行传递的：

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>证明函数中的参数类型是对象时，也是按照值进行传递</title>
</head>
<body>

<script type="text/javascript">
function setName(obj){
obj.name = "deniro";
obj = new Object();//重新定义了一个对象，这时已经变为局部对象，它会在函数执行完毕被销毁
obj.name ="Lily";
}

var person = new Object();
setName(person);
console.log(person.name);//deniro

</script>
</body>
</html>


因此，可以把 ECMAScript 函数的参数想象成局部变量。

4 检测类型

使用 typeOf 检测一个变量是不是基本类型：

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>typeof 检测基本数据类型</title>
</head>
<body>

<script type="text/javascript">
var s = "deniro";
var b = true;
var i = 23;
var u;
var n = null;
var o = new Object();

console.log(typeof  s);//string
console.log(typeof  b);//boolean
console.log(typeof  i);//number
console.log(typeof  u);//undefined
console.log(typeof  n);//object
console.log(typeof  o);//object
</script>
</body>
</html>


使用 typeof 操作符检测函数时，会返回 “function”

使用 instanceof 检测引用类型，语法如下：

result = variable instanceof constructor


如果变量是给定引用类型的示例，instanceof 操作符会返回 true,举例如下：

person instanceof Object
colors instanceof Array
pattern instanceof RegExp
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航