js学习（四）

接上篇继续学习……

For Of 循环

for of 语句循环遍历可迭代对象的值。
它允许循环遍历可迭代的数据结构，例如数组、字符串、映射、节点列表等
语法

for (variable of iterable) {
  // code block to be executed
}

variable - 对于每次迭代，下一个属性的值都会分配给变量。变量可以用 const、let 或 var 声明。
iterable - 具有可迭代属性的对象。
遍历数组：

const cars = ["BMW", "Volvo", "Mini"];  //let language = "JavaScript";
let text = "";
for (let x of cars) {               //for (let x of language) {
  text += x;                      //遍历字符串
}

While 循环

while 循环会一直循环代码块，只要指定的条件为 true。
语法

while (条件) {
    要执行的代码块
}

循环中的代码将运行，一遍又一遍，只要变量（i）小于 10
while (i < 10) { text += "数字是 " + i; i++; }

Do/While 循环

do/while 循环是 while 循环的变体。在检查条件是否为真之前，这种循环会执行一次代码块，然后只要条件为真就会重复循环。
语法

do {
    要执行的代码块
}

while (条件);

实例
下面的例子使用了 do/while 循环。该循环会执行至少一次，即使条件为 false，因为代码块会在条件测试之前执行：
do {
text += "The number is " + i;
i++;
}
while (i < 10);
注意：不要忘记对条件中所用变量进行递增，否则循环永不会结束
比较 For 与 While

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var i = 0;
var text = "";

for ( ;cars[i]; ) {                 // while (cars[i]) {
   text += cars[i] + "
";        // text += cars[i] + "
";
      i++;                          //  i++;
  }                                 //} 
  结果是相同的

break 语句“跳出”循环。
continue 语句“跳过”循环中的一个迭代。

for (i = 0; i < 10; i++) {
    if (i === 3) { break; }             // { continue; }
    text += "数字是 " + i + "
";
}

continue 语句（不论有无标签引用）只能用于跳过一个迭代。
break 语句，如果没有标签引用，只能用于跳出一个循环或一个 switch。
如果有标签引用，则 break 语句可用于跳出任意代码块
break 和 continue 语句是仅有的可“跳出”代码块的 JavaScript 语句。

typeof(类型)

在 JavaScript 中有 5 种不同的可以包含值的数据类型：string，number，boolean，object（对象），function（函数）
有 6 种类型的对象：Object，Date，Array，String，Number，Boolean
以及 2 种不能包含值的数据类型：null，undefined
注意：
NaN 的数据类型是数字
数组的数据类型是对象
日期的数据类型是对象
null 的数据类型是 object
未定义变量的数据类型为 undefined *
未赋值的变量的数据类型也是 undefined *
无法使用 typeof 来确定 JavaScript 对象是否是数组（或日期）。
原始日期
typeof 运算符可以返回以下原始类型之一：string，number，boolean，undefined
复杂数据
typeof 运算符可以返回两种复杂类型之一：function，object
typeof 运算符会为对象、数组和 null 返回 “object”。
typeof 运算符不会为函数返回 “object”。
typeof 运算符会为数组返回 “object”，因为在 JavaScript 中数组是对象。

typeof 运算符并不是变量。它只是一个运算符。运算符 (+ - * /) 没有任何数据类型。
但是，typeof 运算符总是返回字符串（包含 *** 作数的类型）。

constructor 属性返回所有 JavaScript 变量的构造函数。

{name:'Bill',age:19}.constructor  // 返回 function Object()  {[native code]}
new Date().constructor            // 返回 function Date()    {[native code]}
function () {}.constructor        // 返回 function Function(){[native code]}

<script>
const fruits = ["Banana", "Orange", "Apple"];
document.getElementById("demo").innerHTML = isArray(fruits);
function isArray(myArray) {
  return myArray.constructor.toString().indexOf("Array") > -1;
  // return myArray.constructor === Array;  相同的结果
}
</script>

您可以检查 constructor 属性以确定对象是否为日期（包含 “Date” 一词）
const myDate = new Date();

在 JavaScript 中，没有值的变量的值是 undefined。类型也是 undefined

空值与 undefined 无关。空字符串既有合法值又有类型。let car = ""; // 值是 ""，类型是 "string"
Null
在 JavaScript 中 null 即是“无”。它应该是不存在的东西。
不幸的是，在 JavaScript 中，null 的数据类型是一个对象。
你可以认为它是 JavaScript 中的一个 bug，typeof null 是一个对象。类型应为 null。
可以通过将对象设置为 null 来清空对象

let person = {firstName:"Bill", lastName:"Gates", age:19, eyeColor:"blue"};
person = null;    // 现在值为 null，但类型仍然是对象
typeof.person       //返回object

person = undefined; // 现在值和类型都是未定义 ,此时返回的值是undefined

undefined 和 null 值相等但类型不同：
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true

JavaScript 类型转换

Number() 转换数值，String() 转换字符串，Boolean() 转换布尔值

string()

把数值转换为字符串。它可用于任意类型的数字、文字、变量或表达式String(100 + 23) // 从表达式中的数值返回字符串
数字方法 toString() 同理(123).toString()

方法	描述
toExponential()	返回字符串，对数字进行舍入，并使用指数计数法来写。
toFixed()	返回字符串，对数字进行舍入，并使用指定位数的小数来写。
toPrecision()	返回字符串，把数字写为指定的长度。

把布尔转换为字符串String(false) // 返回 "false"布尔方法 toString() 同理true.toString() // 返回 "true"
把日期转换为字符串String(Date()) "demo1">// 返回 "Sat May 14 2022 20:25:46 GMT+0800 (中国标准时间)"

方法	描述
getDate()	获得以数值计（1-31）的日
getDay()	或者以数值计（0-6）的周
getFullYear()	获得四位的年（yyyy）
getHours()	获得时（0-23）
getMilliseconds()	获得毫秒（0-999）
getMinutes()	获得分钟（0-59）
getMonth()	获得月（0-11）
getSeconds()	获得秒（0-59）
getTime()	获得时间（1970 年 1 月 1 日以来的毫秒）

number()

全局方法 Number() 可把字符串转换为数字。包含数字的字符串（比如 “3.14”）转换为数字（比如 3.14）。空的字符串转换为 0。
其他字符串将转换为 NaN（Not a number，不是数字）。

一元 + 运算符
一元的 + 运算符可用于把变量转换为数字：
例：var y = "5"; // y 是字符串 var x = + y; // x 是数字
如果无法转换变量，则仍会成为数字，但是值为 NaN（Not a number）：
例：var y = "Bill"; // y 是字符串 var x = + y; // x 是数字 (NaN)

把布尔转换数值 Number(false) // 返回 0 Number(true) // 返回 1

把日期转换为数字
d = new Date();
Number(d) “demo3”>// 返回 1652532988234
日期方法 getTime() 同理。
d = new Date();
d.getTime() “demo4”>// 返回 1652532988235

自动类型转换
如果 JavaScript 尝试 *** 作一种“错误”的数据类型，它会试图将该值转换为“正确”的类型。
结果并不总是你所期望的：

5 + null    // 返回 5         因为 null 被转换为 0
"5" + null  // 返回 "5null"   因为 null 被转换为  "null"
"5" + 2     // 返回 52        因为 2 被转换为 "2"
"5" - 2     // 返回 3         因为 "5" 被转换为 5
"5" * "2"   // 返回 10        因为 "5" 和 "2" 被转换为 5 和 2

自动字符串转换

document.getElementById("demo").innerHTML = myVar;
// 如果 myVar = {name:"Fjohn"}  // toString 转换为 "[object Object]"
// 如果 myVar = [1,2,3,4]       // toString 转换为 "1,2,3,4"
// 如果 myVar = new Date()      // toString 转换为 "Sat May 14 2022 20:56:28 GMT+0800 (中国标准时间)"
数字和布尔也会被转换，但并不明显：
// 如果 myVar = 123             // toString 转换为 "123"
// 如果 myVar = true            // toString 转换为 "true"
// 如果 myVar = false           // toString 转换为 "false"

原始值	转换为数字	转换为字符串	转换为逻辑
false	0	“false”	false
true	1	“true”	true
0	0	“0”	false
1	1	“1”	true
“0”	0	“0”	true
“000”	0	“000”	true
“1”	1	“1”	true
NaN	NaN	“NaN”	false
Infinity	Infinity	“Infinity”	true
-Infinity	-Infinity	“-Infinity”	true
“”	0	“”	false
“20”	20	“20”	true
“twenty”	NaN	“twenty”	true
[ ]	0	“”	true
[20]	20	“20”	true
[10,20]	NaN	“10,20”	true
[“twenty”]	NaN	“twenty”	true
[“ten”,“twenty”]	NaN	“ten,twenty”	true
function(){}	NaN	“function(){}”	true
{ }	NaN	“[object Object]”	true
null	0	“null”	false
undefined	NaN	“undefined”	false

删除线下的值指示了（某些）程序员也许不希望的值

JavaScript 位运算符

JavaScript 位运算符

运算符	名称	描述
&	AND	如果两位都是 1 则设置每位为 1
竖线（表格不允许竖线）	OR	如果两位之一为 1 则设置每位为 1
^	XOR	如果两位只有一位为 1 则设置每位为 1
~	NOT	反转所有位
<<	零填充左位移	通过从右推入零向左位移，并使最左边的位脱落。
>>	有符号右位移	通过从左推入最左位的拷贝来向右位移，并使最右边的位脱落。
>>>	零填充右位移	通过从左推入零来向右位移，并使最右边的位脱落。

实例

*** 作	结果	等同于	结果
5 & 1	1	0101 & 0001	0001
5 竖线 1	5	0101 竖线 0001	0101
5 ^ 1	4	0101 ^ 0001	0100
~ 5	10	~0101	1010
5 << 1	10	0101 << 1	1010
5 >> 1	2	0101 >> 1	0010
5 >>> 1	2	0101 >>> 1	0010

JavaScript 使用 32 位按位运算数
JavaScript 将数字存储为 64 位浮点数，但所有按位运算都以 32 位二进制数执行。
在执行位运算之前，JavaScript 将数字转换为 32 位有符号整数。
执行按位 *** 作后，结果将转换回 64 位 JavaScript 数。
上面的例子使用 4 位无符号二进制数。所以 ~ 5 返回 10。
由于 JavaScript 使用 32 位有符号整数，JavaScript 将返回 -6。
00000000000000000000000000000101 (5)
11111111111111111111111111111010 (~5 = -6)
有符号整数使用最左边的位作为减号。
And运算位

运算	结果
1111 & 0000	0000
1111 & 0001	0001
1111 & 0010	0010
1111 & 0100	0100

位运算 OR

*** 作	结果
1111 or 0000	1111
1111 or 0001	1111
1111 or 0010	1111
1111 or 0100	1111

位运算 XOR

运算	结果
1111 ^ 0000	1111
1111 ^ 0001	1110
1111 ^ 0010	1101
1111 ^ 0100	1011

JavaScript（零填充）位运算左移（<<）
这是零填充的左移。一个或多个零数位从右被推入，最左侧的数位被移除：

十进制	二进制
5	00000000000000000000000000000101
5 << 1	00000000000000000000000000001010 (10)
5<<2	向左移动两位
5<<<2	向左移动3位

JavaScript（有符号）位运算右移（>>）
这是保留符号的右移。最左侧的数位被从左侧推入，最右侧的数位被移出：

十进制	二进制
-5	11111111111111111111111111111011
-5 >> 1	11111111111111111111111111111101 (-3)

二进制表示	十进制值
00000000000000000000000000000101	5 (4 + 1)
00000000000000000000000000101000	40 (32 + 8)
00000000000000000000000000101101	45 (32 + 8 + 4 + 1)

负数是正数的二进制补码加 1：

二进制表示	十进制值
000 000 000 000 000 000 000 000 000 001 01	5
111 111 111 111 111 111 111 111 111 110 11	-5
00 000 000 000 000 000 000 000 000 101 000	40
111 111 111 111 111 111 111 111 110 110 00	-40
111 111 111 111 111 111 111 111 110 110 01	-41

把十进制转换为二进制，例:

dec2bin(-5)
function dec2bin(dec){
    return (dec >>> 0).toString(2);         //dec>>0前面补位的显示成正数或负数
}//结果是11111111111111111111111111111011   //-101

把二进制转换为十进制，例

function bin2dec(bin){
    return parseInt(bin, 2).toString(10);
}