-
原始值和引用值
- 原始值:存储在栈（stack）中的简单数据段，访问值时直接访问其存储位置;
- 引用值:存储在堆（heap）中的对象，存储在变量处的值是一个指针（point），指向存储对象的内存处,访问值时通过指针访问.
- 原始类型:Undefined、Null、Boolean、Number 和 String ,这些原始类型占据的空间是固定的，所以可将他们存储在较小的内存区域 - 栈中,这样存储便于迅速查寻变量的值
- 如果一个值是引用类型的，那么它的存储空间将从堆中分配;由于引用值的大小会改变，所以不能把它放在栈中，否则会降低变量查寻的速度;相反，放在变量的栈空间中的值是该对象存储在堆中的地址(指针);地址的大小是固定的，所以把它存储在栈中对变量性能无任何负面影响
-
typeof运算
| 返回值 | 参数 | 类型释义 |
|---|---|---|
| undefined | 参数是Undefined类型 | 1.声明但未定义值时; 2.函数无返回值时,返回undefined; 3.undefined派生自null,故 undefined==null为true |
| boolean | 参数是Boolean类型 | 1.Boolean类型有两个值,true和false |
| number | 参数是Number类型 | 1.Number类型包括32位整数,64位浮点数; 2.以0开头的为8进制,以0x开头的为16进制; 3.浮点数必须包括小数点和小数点后数字; 4.科学计数法,用e或E表示; 5.Number.MAX_VALUE 和MIN_VALUE定义最大最小值; 6.大于最大值(Number.POSITIVE_INFINITY),为无穷大Infinity; 7.小于最小值(Number.NEGATIVE_INFINITY)即-Infinity无穷小; 8.isFinite()方法,当参数是无穷大时返回true; 9.NaN非数(not a number),且 NaN==NaN为false;10.isNaN()方法判断是否非数字,非数字返回true; |
| string | 参数是String类型 | 1.string类型是唯一没有固定大小的原始类型; 2.字符串以'单引号或"双引号声明; |
| object | 参数是引用类型或Null类型 | 1. 尚未存在的对象即null; 2.若函数返回值是对象,而无此对象时,返回null; |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>内存管理</title>
<style type="text/css">
h3{color: red;}
.result{background-color: whitesmoke;color: gray;padding: 0.5em;}
</style>
</head>
<body>
<ul>
<li>
<h3>typeof运算</h3>
<p class="result" id="result"></p>
</li>
</ul>
<script>
var i;
var result = "";
result=("var i : "+typeof(i)+"<br />")+("true : "+typeof(true)+"<br />")+("110 : "+typeof(110)+"<br />")+("'str' : "+typeof("str")+"<br />")+("null : "+typeof(null)+"<br />");
document.getElementById("result").innerHTML=result;
</script>
</body>
</html>
image.png
-
类型转换
- 转换为字符串,toString()方法,所有对象(真对象和伪对象)都有此方法;
- 转换为数字,parseInt()和parseFloat()用来转换成整数和浮点数,此方法只对string类型有效,其他类型返回NaN.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>类型转换</title>
<style type="text/css">
h3 {
color: red;
}
.result {
background-color: whitesmoke;
}
.result div {
margin: 0.5em;
}
.result div span {
margin-right: 0.5em;
color: gray;
}
.result div span:first-child {
display: inline-block;
width: 10em;
color: black;
}
.result div span:first-child+span {
color: black;
}
</style>
<script type="text/javascript">
function dictDisplay(eleId, Dictory) {
for(x in Dictory) {
var div = document.createElement("div");
if(!x.match("PS")) {
for(var j = 0; j < 3; j++) {
var span = document.createElement("span");
if(j == 0) span.innerHTML = x;
else if(j == 1) span.innerHTML = ":";
else span.innerHTML = Dictory[x];
div.appendChild(span);
}
} else {
var span = document.createElement("span");
span.innerHTML = Dictory[x];
div.appendChild(span);
span.style.color = "darkgoldenrod";
span.style.width = "100%";
span.style.fontFamily = "楷体";
}
document.getElementById(eleId).appendChild(div);
}
}
</script>
</head>
<body>
<ul>
<li>
<h3>toString() 字符串</h3>
<p class="result" id="toStringResult"></p>
<hr />
<script>
var toStringDict = {
"PS01": "//boolean值则直接转换为对应字符串",
"true.toString()": true.toString(),
"PS02": "//数字无论何种表达形式,默认转换为10进制值表达式",
"(10).toString()": (10).toString(),
"(10.0).toString()": (10.0).toString(),
"(0.8e-4).toString()": (0.8e-4).toString(),
"PS03": "//带基数模式,可以转换为对应的进制字符串",
"(10).toString(2)": (10).toString(2),
"(10).toString(8)": (10).toString(8),
"(10).toString(16)": (10).toString(16)
}
//展示
dictDisplay("toStringResult", toStringDict);
</script>
</li>
<li>
<h3>parseInt() 整数</h3>
<p class="result" id="parseIntResult"></p>
<hr />
<script>
var parseIntDict = {
"PS01": "//非字符串类型返回NaN",
"parseInt(true)": parseInt(true),
"PS02": "//字符串则从下标0开始检索,直到遇到非数字停止(包括小数点),若0位为非数字,则直接返回NaN",
"parseInt('110Red110')": parseInt("110Red110"),
"parseInt('110.234')": parseInt("110.234"),
"parseInt('R110')": parseInt("R110"),
"PS03": "//parseInt()方法识别数字字面量",
"parseInt('0xB')": parseInt("0xB"),
"PS04": "//parseInt()方法还有基模式,可以将2/8/16进制转换为整数",
"parseInt('AF',16)": parseInt("AF", 16),
"parseInt('110',2)": parseInt("110", 2),
"parseInt('110',8)": parseInt("110", 8),
}
//展示
dictDisplay("parseIntResult", parseIntDict);
</script>
</li>
<li>
<h3>parseFloat() 浮点数</h3>
<p class="result" id="parseFloatResult"></p>
<hr />
<script>
var parseFloatDict = {
"PS01": "//parseFloat()方法亦从0下标开始检索,遇到第一个非法字符停止(如果包含多个小数点,只识别第一个)",
"parseFloat('110Red1')": parseFloat('110Red1'),
"parseFloat('R110')": parseFloat('R110'),
"parseFloat('112.11.11')": parseFloat('112.11.11'),
"parseFloat('112.1')": parseFloat('112.1'),
"PS02": "//parseFloat()不识别10进制外的其他进制,也不支持基转换",
"parseFloat('011')": parseFloat("011"),
"parseFloat('110')": parseFloat("110"),
"parseFloat('0x110')": parseFloat("0x110"),
"parseFloat('AF')": parseFloat("AF"),
}
//展示
dictDisplay("parseFloatResult", parseFloatDict);
</script>
</li>
</ul>
</body>
</html>
image.png
-
强制类型转换
- Boolean(value) - 把给定的值转换成 Boolean 型；
- Number(value) - 把给定的值转换成数字（可以是整数或浮点数）；
- String(value) - 把给定的值转换成字符串；
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>强制转换</title>
<style type="text/css">
h3 {
color: red;
}
.result {
background-color: whitesmoke;
}
.result div {
margin: 0.5em;
}
.result div span {
margin-right: 0.5em;
color: gray;
}
.result div span:first-child {
display: inline-block;
width: 10em;
color: black;
}
.result div span:first-child+span {
color: black;
}
</style>
<script type="text/javascript">
function dictDisplay(eleId, Dictory) {
for(x in Dictory) {
var div = document.createElement("div");
if(!x.match("PS")) {
for(var j = 0; j < 3; j++) {
var span = document.createElement("span");
if(j == 0) span.innerHTML = x;
else if(j == 1) span.innerHTML = ":";
else span.innerHTML = Dictory[x];
div.appendChild(span);
}
} else {
var span = document.createElement("span");
span.innerHTML = Dictory[x];
div.appendChild(span);
span.style.color = "darkgoldenrod";
span.style.width = "100%";
span.style.fontFamily = "楷体";
}
document.getElementById(eleId).appendChild(div);
}
}
</script>
</head>
<body>
<ul>
<li>
<h3>Boolean() 函数</h3>
<p class="result" id="BooleanResult"></p>
<hr />
<script>
var BooleanDict = {
"PS01": "//Boolean()转换以下值时为false,其他值均为true",
"Boolean('')": Boolean(''),
"Boolean(null)": Boolean(null),
"Boolean(undefined)": Boolean(undefined),
"Boolean(NaN)": Boolean(NaN),
"Boolean(0)": Boolean(0),
"Boolean(false)": Boolean(false),
"PS02": "//Boolean()转换为true",
"Boolean(5)": Boolean(5),
"Boolean(1)": Boolean(1),
"Boolean('false')": Boolean('false'),
"Boolean('0')": Boolean('0'),
"Boolean(new Object())": Boolean(new Object()),
}
//展示
dictDisplay("BooleanResult", BooleanDict);
</script>
</li>
<li>
<h3>Number() 函数</h3>
<p class="result" id="NumberResult"></p>
<hr />
<script>
var NumberDict = {
"PS01": "//Number()转换整个值,并非从0索引,故若字符串包含非数字,则不识别",
"Number('123R')":Number('123R'),
"Number('12.12.12')":Number('12.12.12'),
"Number('12.1')":Number('12.1'),
"Number('12.0')":Number('12.0'),
"Number('011')":Number('011'),
"Number('0x12')":Number('0x12'),
"PS02":"//部分特殊值的转换结果",
"Number(false)":Number(false),
"Number(true)":Number(true),
"Number(null)":Number(null),
"Number(undefined)":Number(undefined),
"Number(NaN)":Number(NaN),
"Number(new Object())":Number(new Object()),
}
//展示
dictDisplay("NumberResult", NumberDict);
</script>
</li>
<li>
<h3>String() 函数</h3>
<p class="result" id="StringResult"></p>
<hr />
<script>
var StringDict = {
"PS01": "//String()函数可以转换为字符串,包括原始类型",
"String(012)":String(012),
"String(12)":String(12),
"String(0x12)":String(0x12),
"String(false)":String(false),
"String(null)":String(null),
"String(undefined)":String(undefined),
"String(NaN)":String(NaN),
"String(new Object())":String(new Object()),
}
//展示
dictDisplay("StringResult", StringDict);
</script>
</li>
</ul>
</body>
</html>
image.png
-
引用类型
- 引用类型通常称为类;
- Object对象为原始对象,所有对象均继承自此对象(包括属性和方法);
- 通过Boolean(),Number(),String()创建的实例为引用类型;
- Number对象的toFixed()方法可以规定其保留小数位,很实用;
- instanceof 运算符,typeof可以识别类型,但是对于object对象,只返回object,此时可以通过instanceof运算符进行比较计算,返回true则表示与对比结果正确.
网友评论