JavaScript--我发现,原来你是这样的JS(再说引用类型,基本包装类型与个体内置对象)
一.介绍
本篇是续上一篇的,引用类型的下篇,本篇主要是说基本包装类型和个体内置对象。如果你能收获一些知识,那我很高兴,很满足,哈哈哈,希望大家能愉快看完。如果你想学好一门技术,要不忘初心,方得始终。
二.基本包装类型
先说明基本包装类型也是属于引用类型,是接着上一篇的,强调一下.
然后我们记住两句话:
1.基本包装类型是为了方便操作基本类型值而出现的.
2.有一瞬间你出现,转眼却离去.
1.说说这基本包装类型有什么吧,就这3个
- Boolean
- Number
- String
2.有人会疑惑这些家伙不是基本类型吗?怎么变成基本包装类型了?
对,就是要把你搞蒙,不然怎么显得js高深莫测呢。
看看例子:
//有没有觉得这东西是不是很方便,但又很奇怪为什么能这么干
var str = "hello ry"
console.log(str.length); //8 一个属性,直接给出字符串长度
console.log(str.substring(6)); "ry" //一个剪切字符串的方法
上面的例子我们看到,str的值明明是一个基本类型值(String),为什么会有属性,为什么会有方法?
我们记住的第一句话:基本包装类型是为了方便操作基本类型值的:
js在被设计出来时搞了这个叫基本数据包装类型的东西,当对基本类型值访问读取时,后台会自动创建其对应的基本包装类型对象(没错是对象),使得它能进行一些属性和方法的调用。
第二句话:有一瞬间你出现,转眼却离去
就是基本包装类型从创建对象到该对象销毁就一瞬间,之后便逝去了,也就是只有存在于那一行代码执行时(比如:str.length)。
//在前几篇有个这样的例子,这也说明基本包装类型对象只存在于一行代码执行过程
var person = "ry";
person.age = 123; //这时创建了基本包装对象,我们能为属性赋值
console.log(person.age); //undefined 到了下一行代码对象便不见了,其属性值也就没了
再来句通俗的话:String,Number,Boolean 他们有两重身份:基本类型和基本包装类型。但是我们用的时候都是基本类型的(只要我们不去主动创建基本包装类型对象),当需要读取和操作这基本类型值时,他就变身(哈哈,变身),变成一个基本包装类型的对象,变身就厉害了吧,这时它能做的事就更多了。
三.基本包装类型细说
刚才算是介绍清楚基本包装类型了,希望大家能看懂。接下来详细说说这3个基本包装类型:String,Number,Boolean(也就是说他们变身后能干神马)
还有很重要的点,我们一般都不直接创建基本包装类型的对象,这样容易分不清你是操作着基本类型值,还是引用类型。
1.Boolean类型
这个基本包装类型,对应布尔值的基本类型。
a.创建这个类型对象
一如既往的new,只要是对象都new了
//这是Boolean类型对象,这家伙用处不大,上面说了一般都不这样直接创建,这东西给js语言后台弄就对了。
var b = new Boolean();
虽然不直接创建它,但是我们还是要了解它,不是吗,为什么?为了人民日益增长的美好生活的需要。哈哈不是吗。
知识点来了:看注释
//这家伙是基本包装类对象,是对象
var b = new Boolean(false); //他是false的对象
//但是会出现
console.log(b && true); //true
//因为在布尔表达式中对象的布尔值是true,也就是说b这对象将转为true(而不是它的值false)
还有
//这是基本类型值
var t1 = true;
//这是基本包装类型对象,是对象
var t2 = new Boolean(true);
//typeof测试
console.log(typeof t1); //boolean
console.log(typeof t2); //object , typeof 对所有对象都返回object
//instanceof
console.log(t1 instanceof Boolean); //false ,t1是值类型不是对象,所以返回false
console.log(t2 instanceof Boolean); //true
2.Number类型
a.创建对象:知道能创建对象,但我们尽量不要创建对象
var n = New Number(10);
b.方法:知道有什么方法就好了,因为我们用的也就是这些方法。
1.toString():传入参数是告诉它返回多少进制
//这是基本类型
var num = 10;
//读取操作时变身,有能力了,是Number对象的能力
console.log(num.toString(8)); //12 返回了八进制的数
console.log(num.toString(2)); //1010 返回二进制
console.log(num.toString(16)); //a 返回十六进制
2.toFixed(): 传入一个参数(0-20),表示返回的数显示几位小数
var n = 123;
console.log(n.toFixed(2)); //123.00
3.toPrecision():传入一个参数数字, 返回一个合适这个数字不是的位数的格式
var n1 = 123;
console.log(n.toPrecision(2)); //'1.2e+2'
console.log(n.toPrecision(4)); //'123.0'
console.log(n.toPrecision(3)); //'123'
3.String类型
直接上属性和方法
1.length : 返回字符串长度
var str = "hello lovely girl";
console.log(str); //17
2.charAt 和 charCodeAt()
//charAt() 接受一个参数,返回字符串的该参数位置下标的值
var str = "hello";
str.charAt(2); //l
//charCodeAt() 和charAt不同的是返回的是字符编码
str.charCodeAt(2); //108 这是l的字符编码
//还有一种更简单的方法得到字符串对应下标的值,像数组一样用方括号
str[2]; //l
3.concat() 拼接字符串,返回新的字符串
var str = "I ";
//在str上加上字符串
var str1 = str.concat("love you");
console.log(str1); //I love you
//当然我们都习惯直接用+号来完成这操作
var str2 = str+"love you";
console.log(str2); //I love you
4.剪切字符串:slice() , substr() , substring() 传入一或两个参数,返回新的字符串,不会影响原来字符串
//slice(),substring() 1参数是开始位置,2是结束位置(不指定默认到最后)
var str = "welcome";
str.slice(3); //come
str.slice(3,4); //c
str.substring(3); //come
str.substring(4,6); //om
//substr() 1参数是开始位置,2是返回的字符数量
str.substr(3,4); //come 3位置开始的4个字符
str.substr(1,3); //elc
5.indexOf()和lastIndexOf(),查找字符,返回字符第一次出现的位置
//indexOf只传一个参数,默认从0位开始找
var s = "hello";
s.indexOf("l"); //2 从前面开始找l第一次出现在2
s.indexOf(a); //-1
//lastIndexOf() 只传一个参数,默认从后面开始找
s.lastIndexOf("l"); //3 从后面开始找l第一次出现在3
//接受两个参数,第二参数表示从第x位开始查找
s.indexOf(l,1); //2 第二参数表示从第1位开始查找
s.lastIndexOf(l,2); //2 第二参数表示从第2位开始查找
//第二个参数应用,通过循环使用这两方法,找到后增加第二个参数的值来继续寻找字符,最后能把所用的该字符位置找出来
6.trim():删除前置及后缀所有空格,返回新的字符串
var str = " welcome to my blog "; //前后有很多空格
var str2 = str.trim(str);
console.log(str2); //"welcome to my blog"
7.字符串大小写转换 toLocaleUppperCase,toUpperCase,toLocaleLowerCase,toLowerCase
var str = "beautiful";
//大写,两个方法差不多
console.log(str.toLocaleUpperCase()); // "BEAUTIFUL"
console.log(str.toUpperCase()); // "BEAUTIFUL"
//小写,两个方法差不多
console.log(str.toLocaleLowerCase()); // "beautiful"
console.log(str.toLowerCase()); // "beautiful"
8.替换字符串的方法:replace()
var text = "bat,cat,sat,fat";
//第一参数是匹配要替换字符串,第二参数是替换成的字符串
var result = text.replace("at","oo");
console.log(result); "boo,cat,sat,fat"; //只替换了第一个
result = text.replace("/at/g" , "oo");
console.log(result); "boo,coo,soo,foo"; //加了正则表达,替换了全部
9.localeCompare() : 比较两个字符串,通过字符串在字母表的顺序排列
var str1 = "back";
var str2 = "bat";
var str3 = "abc";
console.log(str1.localeCompare(str2)); //-1 "back" 排在 "bat" 前面 返回-1
console.log(str1.localeCompare(str1)); //0 "字符串相等返回0
console.log(str1.localeCompare(str3)); //1 "back" 排在 "abc" 后面 返回1
10.formCharCode() : 接受编码转为字符串
console.log(String.formCharCode(104,101,108,108,111)); //hello
String类型的字符串的方法很多,这里只是简单的举例了他们的使用方法,需要深入建议看看文档哦
四.单体内置对象
内置对象上一篇前面讲了Object , Array , Function,RegExp,Date等,下面还有两个(Global 和 Math)
1.Global对象
最特别的对象,你看不见摸不着,对了,但是就是存在。
怎么理解:golbal是全局的意思,所以对于在全局作用域定义的属性和方法都是Global对象的属性和方法。
比如一些函数:isNaN(),isFinite(),parseInt(),parseFloat()等都是Global的方法。
a.再说一些Global方法:
1.encodeURI()和EncodeURIComponent() : URI编码方法,他们都是对URI进行编码的,以便发送给浏览器
var uri = http://www.xxx.com/ry yuan/
//encodeURI方法:只处理空格,把空格转成了%20
console.log(encodeURI(uri)); //"http://www.xxx.com/ry%20yuan/"
//encodeURIComponent方法: 只要是非数字都转成编码
console.log(encodeURIComponent(uri)); //"http%3A%2F%2Fwww.xxx.com%2Fry%20yuan%2F"
2.eval() 方法: 可以执行解析JavaScript字符串(慎用,少用)
eval("console.log('hello')"); // hello , 等价于console.log('hello');
b.再说说window对象
ES中没有指出如何访问Global对象,但是web浏览器中window对象是Global对象的部分实现,所以我们再浏览器中常说的全局属性和方法是window,也是这个原因
var str = "nice to meet you";
console.log(window.str); //"nice to meet you" , 用window访问其str属性没毛病
2.Math类型的对象
这个对象主要用来辅助完成简单和复杂的运算
a.Math对象的属性:很多下面举例几个常用:
console.log(Math.E); //2.718281828459045 自然底数e
console.log(Math.PI); //3.141592653589793 π
console.log(Math.SQPR); //开根号2
console.log(Math.LN2); //2的自然底数
console.log(Math.LN10); //10的自然底数
b.Math类型的方法
1.min()和max() : 用于确定一组值的最小值和最大值
var max = Math.max(1,2,3,4,5,6);
console.log(max) //6
var min = Math.min(1,2,3,4,5,6); //1
console.log(min) //1
//要找数组的最大值,可以这样做
var arr = [1,23,33,12];
var result = Math.max.apply(Math,arr);
//console.log(result); //33
2.舍入方法:Math.ceil() , Math.floor() , Math.round()
//Math.ceil() 向上舍入
console.log(Math.ceil(1.2)); //2
console.log(Math.ceil(1.5)); //2
console.log(Math.ceil(1.8)); //2
//Math.floor() 向下舍入
console.log(Math.floor(5.1)); //5
console.log(Math.floor(5.6)); //5
console.log(Math.floor(5.9)); //5
//Math.round() 四舍五入
console.log(Math.round(8.1)); //8
console.log(Math.round(8.5)); //9
console.log(Math.round(8.7)); //9
3.生成随机数的方法: random() 返回大于等于0 小于1的随机数
console.log(Math.random()); //0.8261111731972886 随机数
console.log(Math.random()); //0.2343731972234522 随机数
//一条公式:值 = Math.floor(Math.random() * 可能值的总数 + 第一个可能的值); 怎么说,看下面
//如果我想返回从1-10的其中一个随机数
console.log(Math.floor(Math.random()*10+1)) //1-10 可能值总数10,第一个可能值是1
//如果我想返回从1-10的其中一个随机数
console.log(Math.floor(Math.random()*90+10)) //10-100 可能值总数90,第一个可能值是10
4.还有很多方法:
//x的绝对值Math.abs(x)
//x平方Math.sqrt(x)
//x的n次幂Math.pow(x,n)
//正弦余弦正切Math.sin(x), Math.cos(x),Math.tan(x)
//等等
五.说说
本篇结束,对,引用类型也就到这里了落幕,接着还会继续前进的,老铁们,觉得写得好就推荐一下,关注一下吧,yoyo。
同系列前几篇:
第一篇:JavaScript--我发现,原来你是这样的JS(一)(初识)
第二篇:JavaScript--我发现,原来你是这样的JS(二)(基础概念--躯壳篇)
第三篇:JavaScript--我发现,原来你是这样的JS(三)(基础概念--灵魂篇)
第四篇:JavaScript--我发现,原来你是这样的JS(四)(看看变量,作用域,垃圾回收是啥)
第五篇:JavaScript--我发现,原来你是这样的JS(引用类型不简单,且听我娓娓道来)
本文出自博客园:http://www.cnblogs.com/Ry-yuan/
作者:Ry(渊源远愿)
欢迎转载,转载请标明出处,保留该字段。
JavaScript--我发现,原来你是这样的JS(再说引用类型,基本包装类型与个体内置对象)的更多相关文章
- JS--我发现,原来你是这样的JS(引用类型不简单[下篇],基本包装类型与个体内置对象)
一.介绍 本篇是续上一篇的,引用类型的下篇,本篇主要是说基本包装类型和个体内置对象.如果你能收获一些知识,那我很高兴,很满足,哈哈哈,希望大家能愉快看完.如果你想学好一门技术,要不忘初心,方得始终. ...
- javascript学习笔记 - 引用类型 基本包装类型
六 基本包装类型 Boolean,Number,String 这三个引用类型亦称为基本包装类型,与基本的数据类型boolean,number,string相关联.为了方便操作这些基本类型的数据. 引用 ...
- JavaScript--我发现,原来你是这样的JS:面向对象编程OOP[2]--(创建你的那个对象吧)
一.介绍 我们继续面向对象吧,这次是面向对象编程的第二篇,主要是讲创建对象的模式,希望大家能从博客中学到东西. 时间过得很快,还是不断的学习吧,为了自己的目标. 二.创建对象 1.前面的创建对象方式 ...
- JS--我发现,原来你是这样的JS:面向对象编程OOP[2]--(创建你的那个对象吧)
一.介绍 我们继续面向对象吧,这次是面向对象编程的第二篇,主要是讲创建对象的模式,希望大家能从博客中学到东西. 时间过得很快,还是不断的学习吧,为了自己的目标. 二.创建对象 1.前面的创建对象方式 ...
- JS面试题-<变量和类型>-JavaScript的数据类型
前言 整理以前的面试题,发现问js数据类型的频率挺高的,回忆当初自己的答案,就是简简单单的把几个类型名称罗列了出来,便没有了任何下文.其实这一个知识点下可以牵涉发散出很多的知识点,如果一个面试者只是罗 ...
- javascript中的内置对象总结
内置对象 标准内置对象 Object Object.create Object.prototype.toString Object.prototype.hasOwnProperty Boolean S ...
- Javascript之旅——第五站:说说那些所谓的包装类型
最近不看犀牛书了,那本翻译的特烂而且好拗口,尤其是原型那块说的乱七八糟,后来经同事介绍,买了本js高级程序设计,然后就继续 苦逼的看,不吐槽了,继续说说js中有新鲜感的包装类型. 一:String 说 ...
- JavaScript学习笔记 - 进阶篇(1)- JS基础语法
前言 JavaScript能做什么? 1.增强页面动态效果(如:下拉菜单.图片轮播.信息滚动等) 2.实现页面与用户之间的实时.动态交互(如:用户注册.登陆验证等) JS进阶篇学习什么? 在JavaS ...
- javascript:面向对象和常见内置对象及操作
本文内容: 面向对象 常见内置对象及操作 首发日期:2018-05-11 面向对象: JavaScript 是面向对象的编程语言 (OOP).OOP 语言使我们有能力定义自己的对象和变量类型. 对象是 ...
随机推荐
- 【译】The Accidental DBA:Troubleshooting Performance
最近重新翻看The Accidental DBA,将Troubleshooting Performance部分稍作整理,方便以后查阅.此篇是Part 2Part 1:The Accidental DB ...
- java乱码问题处理
java乱码问题处理 java乱码出现的问题有很多,这里主要解释tomcat,jsp,html,http(get,post请求乱码处理).常见的问题可能是tomcat,http请求乱码问题,对于jsp ...
- Jupyter(Python)中无法使用Cache原理分析
前言 最近需要在Jupyter中写一个类库,其中有一个文件实现从数据库中读取空间数据并加载为Feature对象,Feature对象是cartopy封装的geomery列表,能够方便的用于作图等.因为有 ...
- JSON和java对象的互转
先说下我自己的理解,一般而言,JSON字符串要转为java对象需要自己写一个跟JSON一模一样的实体类bean,然后用bean.class作为参数传给对应的方法,实现转化成功. 上述这种方法太麻烦了. ...
- snsapi_base和snsapi_userinfo
1.以snsapi_base为scope发起的网页授权,是用来获取进入页面的用户的openid的,并且是静默授权并自动跳转到回调页的.用户感知的就是直接进入了回调页(往往是业务页面) 2.以snsap ...
- linux cpu load学习笔记
linux系统中的Load对当前CPU工作量的度量 Load Average 就是一段时间 (1 分钟.5分钟.15分钟) 内平均Load. [root@CNC-BJ-5-3N1 ~]# w 20:0 ...
- 基于NIO的Socket通信
一.NIO模式的基本原理: 服务端: 首先,服务端打开一个通道(ServerSocketChannel),并向通道中注册一个通道调度器(Selector):然后向通道调度器注册感兴趣的事件Select ...
- hdu3695 ac自动机入门
Computer Virus on Planet Pandora Time Limit: 6000/2000 MS (Java/Others) Memory Limit: 256000/1280 ...
- Python一维数据分析
1.Numpy数组 numpy的数组只能存放同一种数据类型,使用的方式和Python列表类似 1.1 声明: import numpy as np countries = np.array([ 'Af ...
- php过滤textarea 中的换行符问题
之前我写的替换代码是这样的 $content = str_replace('\r\n', '', $_POST['content']); 为了确保window和Linux的换行符都能去掉,改成这样的: ...