JavaScript高级程序设计学习笔记(三) — 基本引用类型

编程入门 行业动态 更新时间:2024-10-07 00:16:59

JavaScript高级<a href=https://www.elefans.com/category/jswz/34/1771020.html style=程序设计学习笔记(三) — 基本引用类型"/>

JavaScript高级程序设计学习笔记(三) — 基本引用类型

基本引用类型

1.Date

创建日期对象:

let noew  =new Date();

在不传递参数的情况下,创建的对象将保存当前日期和时间,如果想要创建表示其他时间的日期对象,则需要传递一个参数,参数意义为毫秒表示,此时需要两个辅助方法:

  • Date.parse()

Date.parse()方法接受一个表示日期的字符串参数,会将这个字符串转换为表示该日期的毫秒数。

必须支持一下形势:

1.月/日/年

2.月名 日,年

3.周几 月名 日 年 时:分:秒 时区

例如:

let someDate = new Date(Date.parse("May 23,2019"));
//如果不使用parse,那么会隐式调用parse函数
let someDate = new Date("May 23,2019");

如果传递的字符串不表示日期,则该方法会返回NaN。

  • Date.UTC()

UTC()方法返回日期的毫秒表示,参数为年,零起点月数(1月是0,2月是1),日(1-31),时(0-23),分,秒,毫秒。

年和月是必须传入的,日默认为1,其余参数默认为0

UTC()在不调用的时候也会隐式调用,但这种情况下调用的是本地日期,不是GMT日期。

另:

Date.now()方法,返回表示方法执行日期和时间的毫秒数,可以用在代码分析中

let start = Date.now();
test();
let stop = Date.now();
let result = stop-start;

继承的方法

Date重写了toLocaleString(),toString()和valueOf()

  • toLocaleString()返回与浏览器运行的本地环境一直的日期和时间,格式中包含针对时间的AM或PM,但是不包含时区信息
  • toString()返回带时区信息的日期和时间,时间也是24小时制。

现在两个方法的返回值已经趋于一致

  • valueOf()不返回字符串,返回的是日期的毫秒表示。

日期格式化方法

  • toDateString()显示日期中的周几,月,日,年
  • toTimeString()显示日期中的时,分,秒和时区
  • toLocaleDateString()显示日期中的周几,月,日,年
  • toLocaleTimeString()显示日期中的时,分,秒
  • toUTCString()显示完整的UTC日期

日期/时间组件方法

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eJdNIQi9-1603639810863)(C:\Users\刘东旭\Desktop\javascript笔记\images\Date类型方法1.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-34FK9NKb-1603639810865)(C:\Users\刘东旭\Desktop\javascript笔记\images\Date类型方法2.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-P91OnQBW-1603639810866)(C:\Users\刘东旭\Desktop\javascript笔记\images\Date类型方法3.png)]

2.RegExp

js通过regexp来支持正则表达式

正常的正则表达式:

let expression = /pattern/flags;

pattern可以使任何简单或复杂的表达式,包括字符类,限定符,分组,向前查找和反向引用

flags是匹配模式:

  • g:全局模式,表示查找字符串的全部内容,而不是找到第一个匹配的内容就结束
  • i:不区分大小写
  • m:多行模式
  • y:粘附模式,只查找从lastIndex开始及置换的字符串
  • u:unicode模式
  • s:dotAll模式,表示元字符.匹配任何字符
//匹配字符串中的所有at
let pattern1 = /at/g;

所有元字符都需要转义:(利用反斜杠转义\)

( [ { \ ^ $ | } ] ) ? * + .

regexp构造函数

let pattern = new RegExp("[bc]at","i");

构造函数有两个参数,都是字符串形式,第一个是要匹配的正则表达式,第二个是要匹配的模式,所有元字符都需要 二次转义

const rel = /cat/g;
const re2 = new RegExp(rel);  //输出"/cat/g"
const re3 = new RegExp(rel,"i");  //输出/cat/i

RegExp实例属性

每个RegExp实例都有对象的属性

  • global:布尔值,表示是否设置了g标记
  • ignoreCase:布尔值,表示是否设置了i标记
  • unicode:布尔值,表示是否设置了u标记
  • sticky:布尔值,表示是否设置了y标记
  • lastIndex:整数,表示在源字符串中下一次搜索的开始位置,始终从0开始
  • multiline:布尔值,表示是否设置了m标记
  • dotAll:布尔值,表示是否设置了s标记
  • source:正则表达式的字面量字符串,没有开头和结尾的斜杠
  • flags:正则表达式的标记字符串,始终以字面量而非传入构造函数的字符串模式形式返回

RegExp实例方法(未完结109-111)

RegExp构造函数属性

regexp本身也有属性,这些属性适用于作用域中的所有正则表达式,而且会根据最后执行的正则表达式操作而变化

全名简写说明
input$_最后搜索的字符串
lastMatch$&最后匹配的文本
lastParen+$最后匹配的捕获组
leftContext$`input字符串中出现在lastMatch前面的文本
rightContext$’input字符串中出现在lastMatch后面的文本
let text = "this has been a short summer";
let pattern = /(.)hort/g;
if(pattern.test(text)){console.log(RegExp.input);  //this has been a short summerconsole.log(RegExp.input);  //this has been aconsole.log(RegExp.input);  //summerconsole.log(RegExp.input);  //shortconsole.log(RegExp.input);  //s
}

以上创建了一个模式,用于搜索任何后跟hort的字符,并把第一个字符放在了捕获组中

3.原始值包装类型

基础

es提供了三种特殊的引用类型,分别为:Boolean,Number,String

每当用到某个原始值的方法或属性时,后台都会创建一个相应原始包装类型的对象,从而暴露出操作原始值的各种方法

例如:

let s1 = "helo";
let s2 = s1.substring(2);

s1是原始值,本身不应该方法。具体来说,在第二行访问s1时,是以读模式访问的,也就是要从内存中读取变量保存的值,再以读模式访问字符串的时候,后台会执行以下三步:

  • 创建一个String类型的实例
  • 调用实力上的特定方法
  • 销毁实例
let s1 = new String("hello");
let s2 = s1.substring(s1);
s1 = null;

同理,对于布尔值和数值型,在后台也会发生同样的事情

生命周期:引用类型和包装类型的主要区别在于对象的生命周期,在通过new实例化引用类型后,得到的实例会在离开作用域时被销毁,而自动创建的原始值包装对象则只存在于访问他的那行代码执行期间,这意味着不能再运行时给原始值添加属性和方法。

可以显示的使用Boolean,Number,String构造函数创建原始值包装对象。在原始值包装类型的实力上调用typeof会返回"object",所有原始值包装对象都会转换为布尔值true.

另:object为一个工厂函数,能够根据传入值的类型返回相应原始值包装类型的实例。

let obj = new Object("hello");
console.log(obj instanceof String)  //true
let s1 = "hello";
let s2 = new String("hello");
console.log(typeof s1);  //string
console.log(typeof s2);  //object

Boolean

let boolcheck = new Boolean(true);

实例方法:

  • valueof() : 返回一个原始值true或者false
  • toString() : 返回字符串"true"或"false"
let falseObject = new Boolean(false);
let result = falseObject&&true;
console.log(result);  //truelet falseValue = false;
result = falseValue&&true;
console.log(result);  //false

如上:正常来说false&&true为false,但是第一块中结果为true。这是因为这个表达式是对falseObject对象而不是对他表示的值进行布尔求值,而且对象在布尔表达式中都会被转换为true。

另外的区别:typeof运算符对于原始值返回boolean,但对引用值返回"object",同样,boolean对象时boolean类型的实例,在使用instaceof操作符时返回true,但对于原始值返回false。

Number

let numberObject = new Number(12);

number类型也重写了valueof()和toLocaleString()和toString()方法。Valueof返回表示的原始数值,另外两个返回字符串。

其余方法:

  • toFixed() : 返回包含指定小数点位数的数值字符串(参数为几位小数)
  • toExponential() : 返回以科学计数法表示的数值字符串
  • toPrecision() : 方法会根据情况返回最合理的输出结果,接收一个参数,表示结果中数字的总位数(不包括指数)。本质上此方法会根据情况调用toFixed()或者toExponential()

number的引用类型和原始类型在使用**typeof()instaceof()**时判断类型的时候和boolean类似。

es6新增了方法**Number.isInteger()**用于判断一个数值是否为整数。(参数为要判断的数值)

String

let str = new String("hello");

方法和属性:

  • valueOf() toLocaleString() toString():都返回对象的原始字符串值
  • length属性:返回字符串中字符的数量

拓展方法:

1.javascript字符

  • charAt():返回给定索引位置的字符
  • charCodeAt() : 可以查看指定码元的字符编码
  • fromCharCode() : 用于根据给定的UTF-16码元创建字符串中的字符,这个方法可以接收任意多个数值,并返回将所有数值UI应的字符拼接起来的字符串
  • codePointAt() : 接收16位码元的索引并返回改索引位置上的码点。(用于正确解析既包含单码元字符又包括代理对字符的字符串)

2.normalize()方法

3.字符串操作方法

  • concat() : 用于将一个或多个字符串拼接成一个字符串
let stringValue = "hello";
let result = stringValue.concat("world")  //"hello world"
  • slice() substr() substring() :这三个方法都返回调用他们的字符串的一个子字符串,接受一个或两个参数。第一个参数表示子字符串开始的位置,第二个参数表示子字符串结束的位置(不包含结束位置的字符),silice()和 substring()的第二个参数是提取结束的位置(该位置之前的字符都会被提取).而substr(),第二个参数表示返回的子字符串的字符数量,第二个参数不写的话,默认为提取到最后
    当某个参数为负数时:
    slice()方法会将所有负值参数都当成字符串长度加上负参数值;
    substr()方法将第一个负参数只是当成字符串长度加上该值,将第二个负参数值转换为0
    substring()方法会将所有负数转换为0,方法会自动将参数3,0转换为0,3

以上四个方法都不会修改调用他们的字符串,而只会返回提取到的原始新字符串的值。

4.字符串位置方法

下面两个方法都从字符串中搜索传入的字符串,并返回位置,没有的话返回-1

第一个参数为要搜索的字符串,第二个参数为可选参数,指定开始寻找的位置

  • indexOf() : 从字符串开头搜索
  • lastIndexOf() : 从结尾开始搜索

5.字符串包含方法

以下方法都是判断字符串中是否包含另一个字符串的方法,这几个方法都会从字符串中搜索传入的字符串,并返回布尔值,第一个参数都为要搜索的字符串

  • startsWith() : 从索引0开始搜索,第二个参数表示开始搜索的位置(可选)
  • endsWith():从索引(string.length-substring.length)开始搜索,第二个参数表示当做字符串末尾的位置(可选)
  • includes() : 检查整个字符串,第二个参数表示开始搜索的位置(可选)

6.其余方法

  • trim():创建一个字符串的副本,删除前后所有空格符,在返回结果
  • trimLeft():创建一个字符串的副本,从字符串开头开始清理空格符
  • trimRight():创建一个字符串的副本,从字符串末尾开始清理空格符
  • repeat():接受一个整数参数,表示要将字符串复制多少次,然后返回拼接所有副本后的结果
  • padStart()和padEnd():复制字符串,如果小于指定长度,则在相应一边填充字符,知道满足条件。第一个参数为复制的长度,第二个参数是可选的填充字符串,默认为空格
let stringvalue = "foo";
console.log(stringvalue.padStart(6,"."))  //"...foo"

7.字符串迭代与解构

字符串的原型包漏了一个@@iterator方法,表示可以迭代字符串中的每个字符,

let message = "abc";
let stringIterator = message[Symbol.iterator]();
console.log(stringIterator.next());  //{value:"a", done:false}
console.log(stringIterator.next());  //{value:"b", done:false}
console.log(stringIterator.next());  //{value:"c", done:false}
console.log(stringIterator.next());  //{value:undefined, done:true}

还可以在for-of循环中使用

8.字符串大小写转换

  • toLowerCase():转换为小写
  • toLocaleLowerCase():在特定地区实现
  • toUpperCase():转换为大写
  • toLocaleUpperCase()在特定地区实现

9.字符串匹配方法

  • match():接收一个参数,可以是正则字符串也可以是一个RegExp对象

    返回的数组第一个元素是与整个模式匹配的字符串,其余元素是与表达式中的捕获匹配的字符串

  • search():只有一个参数,正则表达式或者一个RegExp对象,这个方法返回模式第一个匹配的位置索引,没有的话返回-1

  • replace():两个参数,第一个是字符串或者RegExp对象(这个字符串不会转换为正则表达式),第二个参数是一个字符串或者是函数,如果第一个参数为字符串,会替换第一个子字符串。如果想要替换所有子字符串。第一个参数必须为正则表达式并且带全局标记

  • split():这个方法会根据传入的分隔符将字符串拆分成数组,第一个参数为分隔符,第二个可选参数为数组大小

let colorText = "red,blue,green";
let colors1 = colorText.split(",")  //["red","blue","green"]

10.localeCompare()方法

此方法是比较字符串,返回下列:

  • 如果按照字母表顺序,字符串应该排在字符串参数前面,则返回负值
  • 如果字符串与字符串参数相等,返回0
  • 如果按照字母表顺序,字符串应该排在字符串参数后头,则返回正值

4.单例内置对象

内置对象:任何由ECMAScript实现提供,与宿主环境无关,并在ECMAScript程序开始执行时就存在的对象

共有五个内置对象:Object,Array,String,Global,Math

Global

规定Global对象为一种兜底对象,它所针对的是不属于任何对象的属性和方法,实际上并不存在全局变量和全局函数,在全局作用域中定义的变量和函数都会变成Global对象的属性

1.URL编码方法

这两种方法用于URI,以便传给浏览器,有效的URI不能包含某些字符,比如空格,使用URI编码方法来编码可以让浏览器能够理解他们,同时又以特殊的UTF-8编码替换掉所有无效字符

  • encodeURI():对整个URI进行编码,不会编码属于URL组件的特殊字符,比如冒号等
  • encodeURIComponent():对单独的组件进行编码,编码所发现的所有非标准字符
  • decodeURI():只对encodeURI()编码过得字符进行解码
  • decodeURIComponent():只对encodeURIComponent()编码过得字符进行解码

2.eval()方法

接受一个参数,即一个要执行的字符串

eval("console.log('hi')");
//两行代码等效
console.log('hi');

使用eval声明的变量和函数都不会被提升

严格模式下,在eval内部创建的变量和函数无法被外部访问

3.Global对象属性

属性说明
undefined特殊值
NaN特殊值
Infinity特殊值
Object构造函数
Array构造函数
Function构造函数
Boolean构造函数
String构造函数
Number构造函数
Date构造函数
RegExp构造函数
Symbol构造函数
Error构造函数
EvalError构造函数
RangeError构造函数
ReferenceError构造函数
SyntaxError构造函数
TypeError构造函数
URIError构造函数

4。window对象

无法访问Global对象,但浏览器将window对象实现为Global对象的代理,因此所有全局作用域的变量和函数都变成了window的属性

获取Global:

let global = function() {return this;
}();

Math

使用math对象提供的方法计算的效率比正常使用代码实现的要快很多,因为math使用了js引擎中搞笑的实现和处理器指令

1.Math对象属性

属性说明
Math.E自然对数的基数e的值
Math.LN1010为底的自然对数
Math.LN22为底的自然对数
Math.LOG2E以2为底e的对数
Math.LOG10E以10为底e的对数
Math.PIπ的值
Math.SQRT1_21/2的平方根
Math.SQRT22的平方根

2.max()和min()方法

求最大最小值:

let max = Math.max(3,54,34);

3.舍入方法

用于把小数值舍入为整数的4个方法:

  • Math.ceil():向上舍入为最接近的整数(变大)
  • Math.floor():向下舍入为最接近的整数(变小)
  • Math.round():执行四舍五入
  • Math.fround():返回数值最接近的单精度浮点数表示

4.其他方法

方法说明
Math.random()返回0-1的随机数,不包含1
Math.abs(x)返回x的绝对值
Math.exp(x)返回e的x次幂
Math.expml(x)等于Math.exp(x)-1
Math.log(x)返回x的自然对数
Math.loglp(x)等于1+Math.log(x)
Math.pow(x,power)返回x的power次幂
Math.hypot(…nums)返回nums中每个数平方和的平方根
Math.clz32(x)返回32位整数x的前置0的个数
Math.sign(x)返回表示x符号的1,0,-0,-1
Math.trunc(x)返回x的整数部分,删除小数
Math.sqrt(x)返回x的平方根
Math.cbrt(x)返回x的立方根
Math.acos(x)返回x的反余弦
Math.acosh(x)返回x的反双曲余弦
Math.asin(x)返回x的反正弦
Math.asinh(x)返回x的反双曲正弦
Math.atan(x)返回x的反正切
Math.atanh(x)返回x的反双曲正切
Math.atan2(y,x)返回y/x的反正切
Math.cos(x)返回x的余弦
Math.sin(x)返回x的正弦
Math.atan(x)返回x的正切

更多推荐

JavaScript高级程序设计学习笔记(三) — 基本引用类型

本文发布于:2024-03-12 09:34:03,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1731216.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:程序设计   学习笔记   高级   类型   JavaScript

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!