云崖♥♥资料

本文主要介绍云崖♥♥资料 方法和在新技术下所面对的“挑战”,方便大家深入理解云崖♥♥资料 过程。本文也将分享云崖♥♥资料 所遇到的问题和应对策略,怎么解决怎么做的问题。
通过深入本文可以理解代码原理,进行代码文档的下载,也可以查看相应 Demo 部署效果。

JavaScript基本数据类型

数据类型分类

  Js中分为两种数据类型,一种是基本数据类型,一种是object引用数据类型。

  当需要去使用object引用数据类型的时候会在栈内存(连续存储)中去调用堆内存(链表存储)中的object引用数据类型对象,这是一个引用过程。

 

  值类型(基本类型):numberbooleannullundefinedstring(在赋值传递中会以引用类型的方式来处理)。

  引用类型:对象、数组、函数。

 

  基本类型值:按值访问,操作的是他们实际保存的值;

  引用类型值:按引用访问,当查询时,我们需要先从栈中读取内存地址,然后再顺藤摸瓜地找到保存在堆内存中的值;

 

云崖♥♥

 

  只有对象才有方法使用,但在Js中也可以使用值类型调用方法,因为它会在执行时将值类型转为引用类型,即跑到堆内存中找方法。

 

类型检测

  Js中提供了丰富的数据类型,在实际开发工作中。要根据不同的数据类型做出不同的处理方案,那么类型检测就显得尤为重要。

 

typeof


  typeof 用于返回以下原始类型

 

  number

  string

  boolean

  function

  object

  undefined

 

  可以使用typeof用于判断数据的类型

<script>"use strict"; ​         let num = 100;         let num_string = "100";         let bool_true = true;         let bool_false = false; ​         function test(){}; ​         let undef;  // 未定义 ​         let dic = {"1":"一","2":"二"}; ​         console.log(typeof num);  // number         console.log(typeof num_string);  // string         console.log(typeof bool_true);  // boolean         console.log(typeof bool_false);  // boolean         console.log(typeof test);  // function         console.log(typeof undef);  // undefined         console.log(typeof dic);  // object ​ ​ </script>

 

instanceof


  instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。

  也可以理解为是否为某个对象的实例,typeof不能区分数组,但instanceof则可以。

 

<script>"use strict"; ​         let num = 100;         let num_string = "100";         let bool_true = true;         let bool_false = false; ​         function test(){}; ​ ​         let dic = {"1":"一","2":"二"}; ​         console.log(num instanceof Number);  // false         console.log(num_string instanceof String);  // false         console.log(bool_true instanceof Boolean);  // false         console.log(bool_false instanceof Boolean);  // false         console.log(test instanceof Function);  // true         console.log(dic instanceof Object);  // true </script>

 

  如果我们用简写的形式生成基本类型,使用instanceof进行判断时会全部变成false

  但是用完整的实例化对象方式生成基本类型则会变成true

<script>"use strict"; ​         let num = new Number(100);         let num_string = new String("100");          let bool_true = new Boolean(true);         let bool_false = new Boolean(false); ​         function test(){}; ​ ​         let dic = {"1":"一","2":"二"}; ​         console.log(num instanceof Number);  // true         console.log(num_string instanceof String);  // true         console.log(bool_true instanceof Boolean);  // true         console.log(bool_false instanceof Boolean);  // true         console.log(test instanceof Function);  // true         console.log(dic instanceof Object);  // true </script>

 

String

  字符串类型是使用非常多的数据类型,也是相对简单的数据类型。

 

声明定义


  使用对象形式创建字符串

<script>"use strict"; ​         let object_string = new String("hello,world");         console.log(typeof object_string);  // object </script>

 

  简便创建字符串,即使用字面量来创建。

<script>"use strict"; ​         let value_string = "hello,world";         console.log(typeof value_string);  // string </script>

 

转义字符


  有些字符有双层含义,需要使用 转义符号进行含义转换。

  下例中引号为字符串边界符,如果输出引号时需要使用转义符号。

 

<script>"use strict"; ​         console.log("JavaScript是一门非常'严格'的语言。");         // JavaScript是一门非常'严格'的语言。 </script>

 

  常用转义符号列表如下

符号 说明
t 制表符
n 换行
斜杠符号
单引号
双引号R

 

连接运算符


  使用 + 可以连接多个内容组合成字符串,经常用于组合输出内容使用。

<script>"use strict"; ​         console.log("JavaScript"+"是一门"+"非常优秀的语言。");         // JavaScript是一门非常优秀的语言。 </script>

 

模板字面量


  JavaScript中没有format格式化字符串,但是有模板字面量。

  你可以使用`${变量函数表达式}`来达到格式化字符串的目的。

  注意,不是单引号。而是`号。

<script>"use strict"; ​         let username = prompt("请输入您的姓名:").trim();         document.write(`欢迎您:${username},很高兴您回家..`); ​ </script>

 

  使用函数或表达式。

<script>          "use strict";          function show() {                  return "云崖先生";          };                  document.write(`欢迎您:${show()},很高兴您回家..`);  </script>

 

  另外,换行操作不会产生错误。会保留原样进行输出。

<script>          "use strict";          console.log(`经过周密的计算,最后结果是:         ${1 + 2},对这个结果满意吗?`);          // 经过周密的计算,最后结果是:         // 3,对这个结果满意吗?          // 会保留原样式  </script>

 

标签模板


  标签模板是提取出普通字符串与变量,交由标签函数处理。

<script>          "use strict";          let username = "云崖先生";         let age = 18;          func`用户名是${username},年龄是${age},看的出来是个小帅哥`;          // ... 是一种语法,可以让形参接收多个参数。用array进行接收。和arguments有点相似,但是要定义形参名称。                  function func(s, ...f) {                 console.log(s); // (3) ["用户名是", ",年龄是", ",看的出来是个小帅哥", raw: Array(3)]                 console.log(f); // (2) ["云崖先生", 18]         };  </script>

 

获取长度


  使用length属性可以获取字符串长度

<script>          "use strict";          console.log("hello,world".length); // 11  </script>

 

大小写转换


  大写转换:toUpperCase()

  小写转换:toLowerCase()

<script>          "use strict";          console.log("hello,world".toUpperCase());  // HELLO,WORLD
        console.log("HELLO,WORLD".toLowerCase());  // hello,world
</script>

 

移除空白


  使用trim()可移除两侧空白。

  使用trimLeft()删除左边空白。

  使用trimRight()删除右边空白。

<script>          "use strict";          console.log("  不移除空白  ");         console.log("  两侧空白  ".trim());          console.log("  左侧空白".trimLeft());         console.log("右侧空白  ".trimRight());  </script>

 

获取单字符


  索引从0开始,往后数。

  可以使用charAt()

  也可使用[]

  使用length-1即可获取最后一位元素,以此类推。

<script>          "use strict";          let str = "ABCDEFGHIJKLMN";         // 取出C         console.log(str[2]);         // 取出D         console.log(str.charAt(3));         // 取出N         console.log(str[str.length - 1]);         // 取出L         console.log(str.charAt(str.length - 3));  </script>

 

截取子字符串


 

方法 说明
slice() 参数1:开始索引值 参数2:结束索引值 特点:取头不取尾
substring() 参数1:开始索引值 参数2:结束索引值 特点:取头不取尾
substr() 参数1:开始索引值 参数2:指定获取长度 特点:从开始索引值往后数参数2的数值-1即可

 

<script>          "use strict";          let str = "0123456789";         // 取出0 1 2 3 4 取头不取尾         console.log(str.slice(0, 5));          // 从2开始取,往后数五个 2 3 4 5 6 7 减去一个 2 3 4 5 6         console.log(str.substr(2, 5));          //  取出0 1 2 3 4  取头不取尾         console.log(str.substring(2, 5));   </script>

 

查找字符串


  查找字符串的索引位置或给出一个布尔值。

 

方法 说明
indexOf() 从开始获取字符串位置,检测不到时返回 -1,第2个参数为从哪个位置开始查找
lastIndexOf() 从结尾来搜索字符串位置,检测不到时返回 -1,第2个参数为从哪个位置开始查找
search() 用于检索字符串中指定的子字符串,也可以使用正则表达式搜索。检测不到时返回 -1
includes() 字符串中是否包含指定的值,第二个参数指查找开始位置,返回的是一个布尔值
startsWith() 是否已特定子串开头。 参数2为查找的位置。返回的是一个布尔值
endsWith() 是否已特定子串结束。参数2为查找的位置。返回的是一个布尔值

 

<script>          "use strict";          let str = "01234567890123456789abcdef";          // 从下标0的位置开始向后找         console.log(str.indexOf("0123"));  // 0         // 从下标3的位置开始向后找         console.log(str.indexOf("ef", 3));  // 24         // 找不到返回 -1         console.log(str.indexOf("z"));  // -1          // 从最后一位下标开始往前找         console.log(str.lastIndexOf("9abc"));  // 19         // 指定下标位,从下标7的位置向前找         console.log(str.lastIndexOf("123", 7));  //  1         // 找不到返回 -1         console.log(str.lastIndexOf("z"));  // -1           // 必须以f结尾         console.log(str.search("f$"));  // 25         // 必须以a开头         console.log(str.search("^a")); // -1         // 必须以89开头结尾是英文         console.log(str.search("89[a-z]"));  // 18           // 是否包含abc         console.log(str.includes("abc")); // true         // 是否包含zzz,从索引2向后检索         console.log(str.includes("zzz", 2)); // false          // 索引2是否234开始         console.log(str.startsWith("234", 2)); // true          // 当前字符串是否已cdef结束         console.log(str.endsWith("cdef")); // true  </script>

 

替换字符串


  replace() 方法用于字符串的替换操作。

  参数1:查找的子串

  参数2:替换的子串

 

  注意,默认只替换一次。

<script>          "use strict";          let str = "hello,world";          let new_str = str.replace("world","Js");          console.log(new_str); // hello,Js     </script>

 

重复生成


  使用repeat()方法可进行重复生成。

<script>          "use strict";          // 生成20个星号         console.log("*".repeat(20));          // ********************    </script>

 

  将电话号码中间四位隐藏。

<script>          "use strict";          let phone = "13811112457";         let new_phone = phone.replace(phone.slice(3, 7), "*".repeat(4));         console.log(new_phone);          // 138****2457  </script>

 

拆分字符串


  使用split()方法可将字符串进行拆分,拆分结果为array类型。

<script>          "use strict";          let str = "hello,world";         console.log(str.split(",")); // ["hello", "world"]  </script>

 

  split()方法的第二个参数可以指定要拿几次拆分,默认是都拿。

<script>          "use strict";          let str = "hello,wor,ld";         // 代表拆分出来只拿前两个,而不是都拿         console.log(str.split(",", 2));  //["hello", "wor"]  </script>

 

合并字符串


  使用concat()方法可将多个字符串合并为一个新的字符串。

<script>          "use strict";          let s1 = "hello",s2 = "world";          //      指定拼接符号    指定要拼接的字符串      指定新添加的内容         let s3 = s1.concat(",",s2,"新添加的内容");         console.log(s3);          // hello,world新添加的内容          </script>

 

类型转换


  如果想让一个对象变为字符串,可以使用Strint()将它包裹。

<script>          "use strict";          let num = 123321;         let num_string = String(num);         console.log(num_string);   // 123321         console.log(typeof num_string);  // string                  let arr = ["a",1,23];         let arr_string = String(arr);         console.log(arr_string);   // a,1,23         console.log(typeof arr_string);  // string  </script>

 

  此外,我们也可以直接对象+""完成类型转换,,这是属于隐式转换。

<script>          "use strict";          let num = 123321;         let num_string = num+"";         console.log(num_string);   // 123321         console.log(typeof num_string);  // string                  let arr = ["a",1,23];         let arr_string = arr+"";         console.log(arr_string);   // a,1,23         console.log(typeof arr_string);  // string  </script>

 

  我们也可以调用对象下的toString()方法,来将对象转换为string类型。

<script>          "use strict";          let num = 123321;         let num_string = num.toString();         console.log(num_string);   // 123321         console.log(typeof num_string);  // string                  let arr = ["a",1,23];         let arr_string = arr.toString();         console.log(arr_string);   // a,1,23         console.log(typeof arr_string);  // string  </script>

 

常用方法大全


 

方法 说明
length 获取长度
大小写转换 
toUpperCase() 大写转换
toLowerCase() 小写转换
移除空白 
trim() 移除两侧空白
trimLeft() 移除左侧空白
trimeRight() 移除右侧空白
获取单字符 
charAt() 获取单字符,与[]使用方法相同
截取字符串 
slice() 参数1:开始索引值 参数2:结束索引值 特点:取头不取尾
substring() 参数1:开始索引值 参数2:结束索引值 特点:取头不取尾
substr() 参数1:开始索引值 参数2:指定获取长度 特点:从开始索引值往后数参数2的数值-1即可
查找字符串 
indexOf() 从开始获取字符串位置,检测不到时返回 -1,第2个参数为从哪个位置开始查找
lastIndexOf() 从结尾来搜索字符串位置,检测不到时返回 -1,第2个参数为从哪个位置开始查找
search() 用于检索字符串中指定的子字符串,也可以使用正则表达式搜索。检测不到时返回 -1
includes() 字符串中是否包含指定的值,第二个参数指查找开始位置,返回的是一个布尔值
startsWith() 是否已特定子串开头。 参数2为查找的位置。返回的是一个布尔值
endsWith() 是否已特定子串结束。参数2为查找的位置。返回的是一个布尔值
替换与重复生成 
replace() 用于字符串的替换操作。参数1:查找的子串 参数2:替换的子串
repeat() 重复生成的次数
合并与拆分 
split() 拆分字符串,拆分结果为数组类型
concat() 合并字符串,产生一个新的字符串

 

方法 说明
charCodeAt() 通过index下标取出元素的Unicode编码
anchor( ) 为字符串添加上a标签
italics( ) 为字符串添加上i标签
bold( ) 为字符串添加上b标签

 

Boolean

  布尔类型包括 truefalse 两个值,是开发中使用较多的数据类型。

 

声明定义


  使用对象形式创建布尔类型

<script>          "use strict";         console.log(new Boolean(true));  // true         console.log(new Boolean(false));  // false          </script>

 

  但建议使用字面量创建布尔类型

<script>          "use strict";         let  status = true;          </script>

 

隐式转换


  基本上所有类型都可以隐式转换为 Boolean类型。

 

数据类型 true false
String 非空字符串 空字符串
Number 非0的数值 0 、NaN
Array 数组不参与比较时 参与比较的空数组
Object 所有对象  
undefined undefined
null null
NaN NaN

 

  当与Boolean类型比较时,会将两边类型统一为数字1或0。

  如果使用Boolean与数值比较时,会进行隐式类型转换 true转为1,false转为0。

<script>          "use strict";      console.log(3 == true); //false     console.log(0 == false); //true  </script> 

 

  当String类型与Boolean类型做比较时,会都转换为Number类型进行比较。

<script>          "use strict";          console.log(true == "1");  // true         console.log(true > "0"); // true  </script>

 

  数组的表现与字符串原理一样,会先转换为数值。

<script>          "use strict";          console.log(Number([]));  // 0         console.log(Number([3]));  // 3         console.log(Number([1, 2, 3]));  // NaN          console.log([] == false);  // true         console.log([1] == true);  // true         console.log([1, 2, 3] == true);  // false  </script>

 

  引用类型的Boolean值为真,如键值对对象和数组。

<script>          "use strict";          if ([]) { console.log("true") } else { console.log("false"); };  // true         if ({}) { console.log("true") } else { console.log("false"); };  // true  </script>

 

 

显式转换


  使用 !! 转换布尔类型。

 

  首先!代表非,取反的意思。

  如果是true则取false,如果是false则去true。这会得到一个相反的布尔值。

  再来一个!,将之前的布尔值再去反。

 

<script>          "use strict";          console.log(!![]);  // true         console.log(!!{});  // true         console.log(!!"");  // false         console.log(!!"0");  // true         console.log(!!"1");  // true         console.log(!!0);  // false         console.log(!!1);  // true  </script>

 

  使用 Boolean() 函数可以显式转换为布尔类型

<script>          "use strict";          console.log(Boolean([]));  // true         console.log(Boolean({}));  // true         console.log(Boolean(""));  // false         console.log(Boolean("0"));  // true         console.log(Boolean("1"));  // true         console.log(Boolean(0));  // false         console.log(Boolean(1));  // true  </script>

 

Number

  JavaScript中,Number包含整数与小数。

 

声明定义


  使用对象方式声明

<script>          "use strict";          let num_obj = new Number(100);          console.log(typeof num_obj);  // object         console.log(num_obj);  // Number {100}  </script>

 

  简便的字面量形式声明

<script>          "use strict";          let num_value = 100;          console.log(typeof num_value);  // number         console.log(num_value);  // 100  </script>

 

类型判断


  使用isInteger()方法可判断是否为整数。

  返回一个布尔值。

<script>          "use strict";          console.log(Number.isInteger(39.5));  // false  </script>

 

  使用isNaN()方法可判断是否为NaN

  返回一个布尔值。

<script>          "use strict";          console.log(Number.isNaN(39.5));  // false  </script>

 

NaN


  NaN表示无效的数值,并且不能使用 == 比较。

  除了可以使用isNaN()方法外,也可以使用Object对象的is方法进行判定。

<script>          "use strict";          // NaN代表无效的数值         let res = "两百" / 2;         console.log(res);         // 使用isNaN()         console.log(Number.isNaN(res));  // true         // 使用Object.is()         console.log(Object.is(res,NaN)); // true  </script>

 

浮点舍入


  使用toFixed()方法对数值进行四舍五入操作,可指定保留小数点后的位数。

<script>          "use strict";          let float_num = 123.456;                  // 四舍五入,保留小数点后两位。         console.log(float_num.toFixed(2)); // 123.46  </script>

 

浮点精度


  大部分编程语言在浮点数计算时都会有精度误差问题,Js也不例外。

<script>          "use strict";          console.log(0.1+0.2); // 0.30000000000000004  </script>

 

  这是因为计算机以二进制处理数值类型,上面的0.1与0.2转为二进制后是无穷的。

<script>          "use strict";          console.log((0.1).toString(2)) //0.0001100110011001100110011001100110011001100110011001101         console.log((0.2).toString(2)) //0.001100110011001100110011001100110011001100110011001101  </script>

 

  一种方式使用toFixed()方法进行小数截取

<script>          "use strict";          // 保留小数点后两位         console.log((0.1 + 0.2).toFixed(2));  // 0.30  </script>

 

  也可通过一些第三方库进行操作,下面演示decimal.js库来进行处理。

<script src="https://cdn.bootcss.com/decimal.js/10.2.0/decimal.min.js"></script> <script>          "use strict";          // 保留小数点后两位         console.log(Decimal.add(0.1, 0.2).valueOf()) // 0.3  </script>

 

普通转换


  使用Number()函数包裹住需要转换的对象。

  基本上所有的数据类型都能转换为Number类型,区别是有的会转换为有效数值,有的会转换为NaN即无效数值。

<script>          "use strict";          console.log(Number('hello')); //NaN         console.log(Number(true));    //1         console.log(Number(false));    //0         console.log(Number('99'));    //99         console.log(Number([]));    //0         console.log(Number([51]));    //51         console.log(Number([5, 2]));    //NaN         console.log(Number({}));    //NaN  </script>

 

  我们也可以使用算术运算符进行隐式转换。

<script>          "use strict";          let str = "123";         let res = str * 1;         console.log(res); // 123         console.log(typeof res); // number  </script>

 

强制转换


  如果一个String即包含数字又包含其他字符,可使用强制转换。

 

方法 说明
parseInt() 提取字符串开始去除空白后的数字转为整数。
parseFloat() 转换字符串为浮点数,忽略字符串前面空白字符。

 

<script>          "use strict";          let str = " 123.4这是一个字符串"         // 强制转换为整数         console.log(parseInt(str));  // 123         // 强制转换为小数         console.log(parseFloat(str));  // 123.4  </script>

 

undefined

  undefined更多代表的是未定义。

 

  第一种情况:定义好变量 但是未进行赋值

<script>          "use strict";          let num;         console.log(num);  // undefined  </script>

 

  第二种情况:函数无返回值

<script>          "use strict";          function test() {                 console.log("执行了...");         };          let res = test();         console.log(res);  // undefined  </script>

 

null

  表示未存在的对象。如果函数或方法要返回的是对象,那么找不到该对象时,返回的通常是 null。    

<script>          "use strict";          let n = null;  // null代表未引用任何对象,也就是为被实例化。此时它所属object对象         let a = [];  // 虽然是一个空数组,但是它是Array的实例对象          console.log(n);  // null         console.log(a);  // []          console.log(typeof n);  // object         console.log(typeof a);  // object  </script>

 

  ECMA中,认为nullundefined是相等的。

  并且值undefined是值null派生出的。

云崖♥♥资料部分资料来自网络,侵权毕设源码联系删除

区块链毕设网(www.qklbishe.com)全网最靠谱的原创区块链毕设代做网站
部分资料来自网络,侵权联系删除!
资源收费仅为搬运整理打赏费用,用户自愿支付 !
qklbishe.com区块链毕设代做网专注|以太坊fabric-计算机|java|毕业设计|代做平台 » 云崖♥♥资料

提供最优质的资源集合

立即查看 了解详情