让学习“上瘾”,成为更好的自己!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>基本包装类型</title>
<script>
/*
1,3个特殊的引用类型:Boolean、Number、String【基本包装类型】
2,当“读取”一个基本类型值的时候,后台会创建一个对应的基本包装类型的对象,从而我们可以调用一些方法来操作这些数据
3,引用类型和基本包装类型的主要区别:对象的生存期
a, 使用new操作符创建的引用类型的实例,在执行流离开当前作用域之前一直保存在内存中
b, 自动创建的基本包装类型的对象,只存在一行代码的执行瞬间,然后“立即”销毁
4,不建议显式调用Boolean,Number和String来创建基本包装类型的对象,必要时可以这么做!!
5,Object构造函数可以像工厂函数那样,根据传入值的类型返回相应的基本包装类型的实例
6,使用new调用基本包装类型的构造函数,和直接调用同名的转型函数是不一样的!
一,Boolean类型
1,创建Boolean对象
var falseObject = new Boolean(false);
2, 重写了valueOf(),toString() and toLocaleString()
3,布尔表达式里边的所有的对象都会被转换成true
4,基本类型的布尔值和Boolean对象的区别:(见下)
【注意】 建议不用显式地使用Boolean对象
二,Number类型
1, 创建Number对象
var numberObject = new Number(10);
2, 重写了valueOf(),toString() and toLocaleString()
3, 数值转换成字符串的方法:
toFixed() : 按指定小数位返回数值的字符串表示
toEXponential():按指定小数位返回以指数表示法(e表示法)表示的数值的字符串形式
toPrecision(): 接收一个表示数值所有数字位数(不包括指数部分)
可能返回固定大小格式,也可能返回指数格式,具体看哪种格式最合适
【共性】这3个方法都可以通过“向上或者向下舍入”,做到以最准确的形式来表示带有正确小数位的值
【注意】 建议不用显式地使用Number对象
三,String类型
1, 创建String对象
var stringObject = new String('hello world');
2, 重写了valueOf(),toString() and toLocaleString()
3, length属性(见下)
4,方法(见下)
// 在正则表达式中使用捕获组时在不同浏览器会有差异,因此,使用时多做测试工作
*/
// 当“读取”一个基本类型值的时候,后台会创建一个对应的基本包装类型的对象,从而我们可以调用一些方法来操作这些数据
var s1 = 'some text';
var s2 = s1.substring(2); // 截取字符串中的子串
// 当第二行代码访问s1时,访问过程处于一种“读取模式”,此时,后台会“自动”完成下列处理:
// (1) 创建Stirng类型的实例
// (2) 在实例上调用指定方法
// (3) 销毁这个实例
// =====理解为如下========
// var s1 = new String('some text'); // (1)
// var s2 = s1.substring(2); // (2)
// s1 = null; // (3)
// var s11 = 'some text';
// s11.color = 'blue';
// console.log(s11.color); // undefined --> why? 第二行代码创建的String对象在执行第三行代码时已经被销毁了
// Object构造函数可以像工厂函数那样,根据传入值的类型返回相应的基本包装类型的实例
// var obj1 = new Object('23');
// var obj2 = new Object(23);
// console.log(obj1 instanceof String);
// console.log(obj2 instanceof Number);
// 使用new调用基本包装类型的构造函数,和直接调用同名的转型函数是不一样的!
// var num = '25';
// var number = Number(num);
// console.log(typeof number); // number
// var obj = new Number(num);
// console.log(typeof obj); // object
// Boolean类型
var falseObject = new Boolean(false);
var falseValue = false;
// console.log(falseObject && true);
// console.log(falseValue && true);
// 基本类型的布尔值和Boolean对象的区别
// console.log(typeof falseObject); // object
// console.log(typeof falseValue); // boolean
// Boolean对象是Boolean类型的实例,所以以下是true
// console.log(falseObject instanceof Boolean);
// console.log(falseValue instanceof Boolean); // false
// Number类型
// toFixed():‘不足补0,多则舍入’
// var num = 10.005;
// console.log(num.toFixed(2)); // "10.01"
// var num1 = 10;
// console.log(num1.toFixed(2)); // "10.00"
// // toExponential():‘不足补0,多则舍入’
// console.log(num.toExponential(2)); // "1.00e+1"
// console.log(typeof (num.toExponential(2)));
// // toPrecision():
// var num3 = 99;
// console.log(num3.toPrecision(1)); // '1e+2'
// console.log(num3.toPrecision(2)); // '99'
// console.log(num3.toPrecision(3)); // '99.0'
// String类型
// length属性
var str1 = 'h\nello world';
// console.log(str1.length); // 转移字符算一个字符
// 1,字符方法:charAt(), charCodeAt(), 方括号
// var stringValue = 'hello world';
// console.log(stringValue.charAt(1)); // 'e'
// console.log(stringValue.charCodeAt(1)); // '101'
// console.log(stringValue[1]);
// 2,字符串操作方法:
// a,concat(): 拼接字符串,不会修改字符串本身的值 更多使用加号操作符
var str1 = 'hello ';
// console.log(str1.concat('world','23',' 90'));
// console.log(str1+'world'+'23'+' 90');
// b,基于子字符串创建字符串的方法:二个参数,第一个为子字符串开始的位置,第二个为结束位置
// 不会修改字符串本身的值!!!
// var stringValue = 'hello world';
// console.log(stringValue.slice(3));
// console.log(stringValue.substring(3));
// console.log(stringValue.substr(3));
// console.log(stringValue.slice(3,7)); // 'lo w'
// console.log(stringValue.substring(3,7)); // 'lo w'
// slice, substring(): 第二个参数为结束位置
// console.log(stringValue.substr(3,7)); // 'lo worl'
// substr(): 第二个参数是返回字符的个数
// 传入的参数是负数时,
// slice(): 将传入负值与字符串长度相加
// substring(): 把所有的负值都转换成0
// substr(): 第一个参数加上字符串长度,第二个转换为0
// var stringValue = 'hello world';
// console.log(stringValue.slice(-3)); // 'rld'
// console.log(stringValue.substring(-3)); // 'hello world'
// console.log(stringValue.substr(-3)); // 'rld'
// console.log(stringValue.slice(3,-4)); // 'lo w'
// console.log(stringValue.substring(3,-4)); // 'hel'
// stringValue.substring(3,0) 等价于 stringValue.substring(0, 3)
// console.log(stringValue.substr(3,-4)); // ''
// 3,字符串位置方法:
// 第一个参数:要查找的字符
// 第二个参数(可选):起始查找位置
// indexOf(): 从前到后,第一个
// lastIndexOf(): 从后到前,第一个
// 没有找到返回-1
var stringValue = 'hello world';
// console.log(stringValue.indexOf('o',5)); // 7
// console.log(stringValue.lastIndexOf('o',8)); // 7
// 循环得到出现的所有位置
// var strText = 'rere jfkdjk ejebnl ekkeejdfakd adf';
// var arr = new Array();
// var pos = strText.indexOf('e');
// while(pos != -1){
// arr.push(pos);
// pos = strText.indexOf('e', pos + 1);
// }
// console.log(arr);
// 4,trim()方法:创建一个字符串副本,删除前置和后缀的所有空格,然后返回结果
// var str2 = ' hello world ';
// console.log(str2.trim());
// console.log(str2.trimLeft()); // support this
// console.log(str2); // 原始字符串不会发生变化
// 有些浏览器支持trimLeft() and trimRight()
// 5,字符串大小写转换
// toLowerCase() and toUpperCase()
// toLocaleLowerCase() and toLocaleUpperCase() 【建议写这种!!!】
// var str3 = 'hello world';
// console.log(str3.toLocaleUpperCase());
// console.log(str3.toUpperCase());
// 6, 字符串模式匹配方法
// match(): 一个参数,正则表达式或者RegExp对象
// 本质上与调用RegExp()方法相同
var text = 'cat,bat,sat,fat';
var pattern = /.cat/;
// console.log(text.match(pattern)); // 返回一个数组
// search(): 没有匹配到返回-1;始终从字符串开头向后查找
// console.log(text.search(pattern)); // 返回1,即在字符串第一次出现的位置
// replace():
// 第一个参数是字符串,第二个参数是字符串或函数,【只替换第一个匹配到的】
var text = 'cat,bat,sat,fat';
// console.log(text.replace('at','one')); // cone,bat,sat,fat
// 第一个参数是RegExp对象,第二个参数是字符串或函数, 且指定为全局(g)标志 【替换所有匹配到的】
// console.log(text.replace(/at/g, 'one')); // cone,bone,sone,fone
// 第二个参数是函数
// 函数有3个参数:模式的匹配项,模式匹配项在字符串中的位置,原始字符串
// function htmlEscape(text){
// return text.replace(/[<>"&]/g, function(match, pos, originalText){
// switch(match){
// case '<':
// return '<';
// case '>':
// return '>';
// case '&':
// return '&';
// case '\"':
// return '"';
// }
// });
// }
// htmlText = '<p class=\"greeting\">Hello world!</p>';
// console.log(htmlEscape(htmlText));
// <p class="greeting">Hello world!</p>
//split():基于指定的分隔符将一个字符串分割成多个子字符串,返回一个数组
// 第一个参数可以是字符串或者RegExp对象
// 第二个参数指定数组的大小(可选)
var colorText = 'red,blue,green,yellow';
console.log(colorText.split(',')); // ["red", "blue", "green", "yellow"]
console.log(colorText.split(',',3)); // ["red", "blue", "green"]
console.log(colorText.split(/[^\,]+/)); // ["", ",", ",", ",", ""]
// 7,localeCompare()方法:字母表顺序(字符串第一个的字符)
var stringValue = 'yellow';
// console.log(stringValue.localeCompare('brick')); // 1
// console.log(stringValue.localeCompare('yellow')); // 0
// console.log(stringValue.localeCompare('zoo')); // -1
// 8,fromCharCode()方法:接收一个或多个字符编码,然后转换成一个字符串
// console.log(String.fromCharCode(104, 101, 108, 111)); // 'hello'
// 9,HTML方法(尽量不要使用!!)
</script>
</head>
<body>
</body>
</html>```