js基本

Posted 2022-03-03 akangwx0624

  5.数值转换

      在javascript里面，有3个函数可以将非数值的数据转为数值，分别

      是Number()，parseInt() 以及parseFloat()这3个方法，下面我们将依次对这几个方法进行介绍

      Number0:可以将非数值转为数值

      使用Number()函数的时候，有下面几个规则需要注意:

      .如果是Boolean值， true和false将分 别被转换为1和0

      ●如果是数字，那么就是简单的传入和返回●如果是null值， 那么返回0

      ●如果是undefined, 那么返回NaN

      示例如下:

      console. log(Number(true));//1console. log(Number(false));//0console. log(Number(10));//10console. log(Number(null));//0

      console. log(Number (undefined);//NaN

      如果是字符串，那么又有如下的规则: .如果字符串只包含数字，则将其转为十进制，即1”会变成1,”123"变成123, 而“011"会变为11 (注意这里不会被当成八进制来处理)

      ，如果字符串中包含有效的十六进制格式，如"1.1”， 则将其转换为对应的浮点数值

      。如果字符串中包含有效的十六进制格式，例如"0xf", 则会将其转换为相同大小的十进制整

      如果字符串是空的，则将其转换为0

      如果字符串包含上述格式之外的字符，则将其转换为NaN

      示例

      console. log(Number("1"));//1console. log(Number(*012"));//12console. log(Number("6010"));//8console. loq(Number111"));//7console. log(Number("3.14"));//3.14console. log(Number("0xf"));//15console. log(Numbr*"));//0

      console. log(Number("123Hello"));//NaN

      parselnt0:也是将一个非数值转为数值

      说明相比number0函数，parsent0会更多的看是否有数字，有就会将其转换为数值。 最简单的例子为numbern函数转换"123H elo"时会转换为NaN, arsent)则会将其转换为123.碰到空字符串时，number0函数会将其转换为0,而parseintO则会将其转换为NaN最后是在碰到小数时，会有一个取整的过程。 例如314"会被转换为"3"示例:

      console. log(parseInt("1"));//1console. log(parseInt("12));//1/2console. log(Numtbe(*0"));//8console. log(Numbt1*6111"));//7console. log(parselnt(3.14"));//3. consale loanarselt(*11.//15)

我们的parseInt)从Es5开始还提供了第二个参数，那就是指定参数是多少进制，这样parseInt()函数就可以将指定的进制转换为十进制，如下:

      console. log(parseInt("012"));//12console. Log(parseInt("012" ,8));//10

//如果是16进制数，后面添加上参数16后，字符串前面可以不写

      console. Log(parseInt("AF"));//NaNconsole. log(parseInt("AF",16));//175

除此之外，我们的parseInt()函数的第2个参数还可以是任意值，八进制前面不用加前面的0,十六进制不用加前面的0x

console. log(parseInt("21" ,3));//7console. log(parseInt("18",2));//2console. log(parseInt("11",8));//9console. log(parseInt("AF",16));//175

 

parseFloat0:将非数值转为浮点数

说明: parseFloat(只解析 +进制值，所以没有第二个参数，该函数会将带有小数点的字符串转换为小数。如果没有小数点的数会被转换为整数。同样的parseFloat0也是尽可能转换更 多的数值，例如"123Hello"会被转换为123.示例

      console. log(parseFloat (*21"));//21

      console. log(parseF loat("123Hello"));//123console. Log(parseF loat("0xA"));//8

      console. log(parseF Loat("3.14"));//3.14

  1.字符串介绍

      这是程序里面使用最为广泛的一种类型。ascop里面，可以使用单引号，也可以使用双引

   N

      Let a= "abcd";let b= ‘abcd‘ ;

      这里需要注意个问题， 就是字符串的内容本身包含单引号或者双引号的话，需要和字符串界限符区分开，如下:

      let a= "Hello ‘World‘ ,welcome";//正确Let b= ‘Hello "World" , welcome‘ ;//正碑Let c = "Hello "World" ,welcome";//错误

      当然，我们这里使用转义字符也是一个很好的选择，如下:

      let a= "Hello ‘World‘ ,welcome"://正确let b = ‘Hello“World" welcome‘;//正确Let c二"Hello \"World\" ,welcome";//正确

      字符串这种数据类型非常的霸道，它和其他数据类型相加都会被转换为字符串类型，示例如下:

      Let a = "abcd";Let b=13+ a;Letc=3.14+a;Letd= true +a;

Let f = undefined + a;

console. log(typeof b);//stringconsole. log(typeof c)://stringconsole. log(typeof d);//stringconsole. log(typeof e)://stringconsole. log(typeof f);//string

所以如果我们要让一个非字符串的变量转换为字符串的话， 只需要和个空字符串相加就可以了。

当然，转换字符串事实上我们也有相应的函数来转换，最常见的就是toString0函数。

toString0

说明:该函数会将除了null和undefined以外的数据类型转换为字符串。示例

      Let a= 18,b = true,c = null,d;

      console. log(typeof a. toStr ing());//string

      console. log(typeof b. toString());//stringconsole. log(typeof c. toString));//报错console. log( typeof d. toString());

可以看到，程序报错，因还有一个知识点，就是oString0函数在转换数值的时候因为allundefined并不能通过toString0函数来转换为相应的字符串。是可以带有参数的。可以将数值指定转换

为几进制示例:

      i= 10;

console.console. log(i. toStringogli. tstrin31/1010());//18;//18console. logli.toftring8));//12

这个时候，Jascip还有一个函数是Srino, 这个函数就可以种数据类型都转换为字符事，示例:

      let a= 18,b = true,c = null,d;

      console. log(String(a),  rpef String(a));//18 stringconsole.log(Stri  (b), typeof string))i//true stringconsole.log(string(c), typeof Stringl();//null string

 

console. log(String(d), typeof Str ngl)//undfined string

2.字符串模板字符串模板

在ES6中新增了模板字面量是增强版的字符串，它用反引号()标识

let str = Hello World ;

      console. log(str)://Hello Worldconsole. log(typeof str);//string console. log(str.length);//11

以上代码中，使用模板字面量语法创建一个字符串，并赋值给message变量，这时变量的值与一个普通的字符串无异

如果想在字符串中包含反引号，只需使用反斜杠\转义即可

ES6的模板字面量使多行字符串更易创建，因为它不需要特殊的语法，只需在想要的位置直接换行即可，此处的换行会同步出现在结果中

      Let str =Hello World ;

      console. log(str);

变量占位符允许将任何有效的15表达式成入到模板字面量中，并将其结果输出为字符串的一部分

      变量占位符由起始的S(与结束的)来界定，之间允许放入任意的JS表达式。最简单的变量占位符允许将本地变量直接嵌入到结果字符串中

      let name = "xiejie";

      console.log( Hello, $name );//Hello,xiejie

占位符$name)会访问本地变量name，并将其值插入到message字符串中。message变量会立即保留该占位符的结果

既然占位符是JS表达式，那么可替换的就不仅仅是简单的变量名。可以轻易嵌入运算符、函数调用等

      Let count = 10,price = 0.25;

      console. log( $count items cost sl(count*price).toFixed(2)) );//10 items cost $2.50

      2-3-6 symbol类型

      ES5中包含5种原始类型:字符串、数字、布尔值、nulundefindn ES6引|入了第6种原始类型:symbol

      ESS的对象属性名都是字符事，很容易造成属性名冲突。比如，使用了一个他人提供的对象， 想为这个对象添加新的方法，新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证了属性名冲突。这就是ES6引入symbol的每个属性的名字都是独一无的，这样就从根本上防止了原因。

      1/简单值

Let str = "Hello World";Let num = 10;Let bol = true;Let myNull = null;

      let undef = undef ined;//复杂值

      letobj=

      name : ‘xiejie‘,age : 18,

      isPassed : true;

      Let arr = [1,2,3,"Hello" , true];

3.访问方式

按值访问

简单值是作为不可细化的值进行存储和使用的，引用它们会转移其值

      let str = "Hello";Let str2 = str;str = null;

 

      console. log(str,str2);//null "Hello"

 引用访问：
      复杂值是通过引用进行存储和操作的，而不是实际的值。创建-个包含复杂对象的变量时，其值是内存中的一个引用地址。引用一个复杂对象时，使用它的名称(即变量或对象属性)通过内存中的引用地址获取该对象值
      let obj = ;let obj2 = obj;
      obj.name = "xiejie";
      console. log(obj .name);//xiejieconsole. Log(obj2.name);//xiejie
      4.比较方式
      简单值采用值比较，而复杂值采用引用比较。复杂值只有在引用相同的对象即有相同的地址时才相等。即使是包含相同对象的两个变量也彼此不相等，因为它们并不指向同一个对象
      示例1:
      Let a= 10;Let b= 10;
      Let c = new Number(10);Let d= c;
      console. Log(a === b);//trueconsole. log(a = c);//falseconsole.log(a = c);//trued=10;
      console. log(d ciconsole. loa(d === c);/= c);//true)://false 

2-4运算符
任何编程语言基本上都离不开运算符。在JavaScript中也是 支持众多运算符的。例如最常见的算数运算符，比较运算符，逻辑运算符等。接下来， 就让我们起来看T下JavaSript中这几种常见的运算符。

2-4-1算数运算符
常见的算数运算符有加减乘除和取模运算。主要需要注意的就是，在动态语言中做除法运算时，能够得到小数。下面是关于算数运算符的示例:

console.log(5 + 3.14);//8.14console. log(6一11);//-5console.log(7 * 3);//21console.Iog(5 ! 2);//2.5console. log(10 % 3);//1

从ES6开始新增加了求幕运算，使用两个号代表求幂。以此可以代替以前的Mth.pow()方法
console.log(2 ** 3);//8
2-4-2-元运算符
所谓元运算符，就是指只作用于一个操作数的运算符。和递增递减运算符。

常见的一元运算符有两种，赋值运算符
此外还有自那关于赋值运算符，前面我们已经见到过了。第一系列健情沅管符且休的示例加下:最常见的就是=  代表将右边的内容赋值给左边。

  2.递增和递减

 

除了上面所介绍的赋值运算符以外，常见要注意前置和后置的区别。  元运算符还有递增和递减。在递增递减中，主要需是先参与运算，然后再自增或者自减，示例如下自如果是前置，那么是先自增或自减，然后参与运算。如果是后置，则

 

      前置示例:

 

      leta=2;Letb=10;

 

      letc=--a+b;Let d=a+ b;

 

      console. log(a,b,c,d)://1 10 11 11

 

后置示例:

 

      Let a= 2;letb=10;

 

      letc=a--+ b;Letd=a +b;

 

      console. log(a,b,c,d);//1 10 12 11

 

需要注意的是，我们的自增自减操作符不仅仅局限于数值，其他类型也可以，遵循下面的规则:

 

      ， 在应用于一个包含有效数字字符的字符串时，现将其转换为数字值，再执行加减1操作。字符串变量变为了数值变量。

 

      , 在应用于一个不包含有效数字字符的字符串时，将变量的值设置为NaN,字符串变量变成数值变量。

 

      ， 遇布尔值faise时， 先将其转换为0再执行加减1操作，布尔值变量变成数值变量。.遇布尔值true时，先将其转换为1再执行加减1操作，布尔值变量变成数值变量。●在应用浮点数数值时，执行加减1操作。

1.关系运算符

 

      ★  白ne小于，大于，小于等于，大于等于数的比较就不用说了，如下

 

      console. log(5 > 3);//trueconsole.og(3 > 5);//false

 

      主要说下字符串的比较，如下:

 

      console.log("e" > "b");//trueconsole. log("C" > "box");//true

 

      这里的比较主要是按照ASCI码来进行比较的。

 

      则转换为NaN如果是一个字符串和个数字进行比较那么会将字符串先转换为数字，如果不能转接为数字，

 

      console.Log("5" > 3);//true, 因为“5"转为了5/任何个数与NaN进行关系比较返回的都是false

 

      N console. log("Hello" > 3);//false, 因为"Hello"转为TNaN

 

      完整的特殊规则如下:

 

      ●如果两个数都是数值，则执行数值比较

 

      ●如果两个数都是字符串，则比较两个字符串对应的字符编码

 

      ●如果一个操作数是数值，则将另个操作数转换为一个數值，然后执行数值的比较

 

      ， 如果一个操作数是对象，则调用这个对象的value0f() 方法，用得到的结果按照前面的规则执行比较。如果对象没有value0f() 方法，则调用toString()方法，并用得到的结果根据前面的规则执行比较。

 

      如果一个数是布尔值，则先将其转换为数值，然后再进行比较

1.非

所谓非，就是取反，非真即假，非假即真

let i = true;

console. log(!i);//false

 

非运算符不仅仅只能用于布尔值，其他数据类型也是可以的，如下:

如果操作数是一个对象， 返回talse如果操作数是个空字符串，返回true如果操作数是一个非空字符串，返回taise如果操作数是数值0,返回true

如果操作数是任意非0数值(包括ifnity),返回faise如果操作数是null,返回true如果操作数是NaN,返回rue

如果操作数是undefined,返回true

console. lglfal5l):///console. log(!"blue");//false

console. log( !0)://trueconsole. log( !NaN);//trueconsole. log( /://trueconsole. Log(!12)://false

2.与
作用于两到多个值，并且只有所有的操作数都是真值时，才为irue
consoLe.Log(false && true);//falseconsole.log(true & true);//true
JavaScript里面的与存在短路现象，具体说明如下:
●第一个操作数为真会进入第二个操作数的判断，且无论第二个操作数真假，都会返回第二
个操作数。
●第一个操作数为假:不会进入第二个操作数的判断，直接返回第一个操作数。

来看下面的例子:
console.log(3 && 5);//5
console. log("Hello" 8& 20);//28
console. log("Hello" 8& false);//false
console. log(" 86 "se/;//console. log("Hello" && ‘);///ou
下面是关于与运算符的道经典练习题:
Let a =true;
let b= a & c;//因为a是true,所以会判断第2个数console. log(b);
//ReferenceError: C is notdefined

3.或
同样是作用于两到多个值，但是只要有一个操作数为真， 就返回真
console.log(false I true);//trueconsole.log(true I1 false);//true
JavaScript里面的或同样存在短路现象，具体说明如下:
.如果第一个操作数为真，则不会进入第二个数的判断。所以无论第二个操作数真假，都直接返回第一个操作数
●如果第一个操作数为假，则会进入第二个数的判断。但是无论第二个操作数真假，都直接返
回第二个操作数
来看下面的例子:
console. log(false I1 true);//trueconsole. log("Hello" I1 "");//Helo console. log("Hello" 11 "str");//Helloconsole. log(NaN 11 "");//*/
console.log(0 I "Hello World");//Hello worldconsole. log(" 11 ‘str‘);//strconsole.log(‘‘ 11 false);//false
下面是关于或运算符的道经典练习题:
Let a= false;
Letb=a i C;//因为是false,所以会判断第个数console. log(b);

3-1条件语句
条件语句，主要就是给定一个判断条件， 并在程序执行过程中判断该条件是否成立，然后根据判断结果来执行不同的操作，从而改变代码的执行顺序，实现更多的功能。-般来讲，条件语句可以分为3种单分支语句，双分支语句以及多分支语句，我们个个来看。
3-1-1单分支语句
单分支语句，由一个i组成，如果条件成立，则进入代码块开始执行语句，单分支语句的语法如下:
if(条件)
11条件为真时执行的代码
示例:
I
let age = 20;if(age >= 18)
console. log("你已经是成年人了");

如果条件不是一个布尔值，那么会被自动转换为布尔值
if(1)
console. Log("Hello");

双分支语句：

顾名思义，就是有两个分支线，如果if条件不成立，那么就会跳入到else语句