【ECMAScript】循环、引用值初识、显示及隐式类型转换

小管打天下

已于 2022-06-01 05:20:13 修改

阅读量907

点赞数

分类专栏： # ECMAScript 文章标签： ecmascript

于 2021-05-01 02:04:00 首次发布

本文链接：https://blog.csdn.net/qq_42647547/article/details/116246094

版权

ECMAScript 专栏收录该内容

21 篇文章 3 订阅

订阅专栏

1. 循环

1.1 for

写法

for (声明变量; 比较运算; ++或--) {
    执行语句
}
for (var i = 0; i < 10; i++) {
    console.log(i)
}
// 变形：                                 
var i = 0;             // i 可以提出来，因为它在循环中只执行一次
for (; i < 0;) {       // 分号占位
    console.log(i)
    i++;           	   // i++ 总是在判断之后执行，所以可以放在最后执行
}
// 步骤：
// 1. 声明变量 i  = 0  
// 2. 判断条件 → 满足条件继续循环 不满足条件停止循环  
// 3. i++

1.2. while

写法

var i = 0;
while (i < 10) {
    console.log(i)
    i++;
}

死循环

var i = 0;
while (1) {     // 死循环 条件永远满足
    console.log(i)
    i++;
}

1.3. do while

无论条件是否成立，都会先执行一次

var i = 0;
do {
    console.log('我要开始循环了'); // 这里会执行一次，和写在外面没什么区别
    i++;
} while (i < 10);

1.4. 题目

1.4.1. 让如下代码只输出1-10，不可以用return/exit(0)/break

var i = 1;
for (; 1;) {
    console.log(i);
    i++;
    if (i == 11) {
        i = 0; 
    }
}

1.4.2. 从0开始做加法，加到什么时候总和是小于100的

var sum = 0;
for (var i = 0; i < 100; i++) {
    sum += i
    if (sum > 100) {
        break;
    }
    console.log(i, sum);
}

1.4.3. 100以内的数，跳过可以被7整除或个位数是7的数

整除用 % 个位用 %10

写法一

for (var i = 0; i <= 100; i++) {
    if (i % 7 != 0 && i % 10 != 7) {     
        console.log(i);
    }
}

写法二

for (var i = 0; i <= 100; i++) {
    if (i % 7 == 0 || i % 10 == 7) {
        continue; // 跳过当前循环，继续下一次循环
    }
    console.log(i);
}

1.4.4. 计算 0-9 的和

var sum = 0;
for (var i = 0; i < 10; i++) {
    sum += i
}

1.4.5. 可以被4，5，6整除的数

for (var i = 0; i < 100; i++) {
    if (i % 4 == 0 || i % 5 == 0 || i % 6 == 0) {
        console.log(i)
    }
}

1.4.6. 打印0-100的数，()里只能有一句，不能写比较，{} 里不能出现 i++ i–

var i = 101
for (; i--;) {      // 中间的条件语句可以写表达式
    console.log(i);
}

1.4.7. 10的N次方

var n = 5;
var num = 1;
for (var i = 0; i < n; i++) {
    num *= 10
}
console.log(num);

1.4.8. n的阶乘

阶乘：1 * 2 * 3 * 4 * 5

var n = 5;
var num = 1;
for (var i = 1; i <= n; i++) {
    num *= i
}
console.log(num);

1.4.9. 将值 789 打印为 987

var num = 789;
var a = num % 10; // 9
var b = (num - a) / 10 % 10; // 8
var c = (num - a - b * 10) / 100; // 7
console.log("" + a + b + c);

1.4.10. 打印三个数中最大的数

var a = 1,
    b = 2,
    c = 3;
if (a > b) {
    if (a > c) {
        console.log(a);
    } else {
        console.log(c);
    }
} else {
    if (b > c) {
        console.log(b);
    } else {
        console.log(c);
    }
}

1.4.11. 打印100以内的质数

质数：仅仅能被1和自己整除的数，1不是质数

var count = 0  
for (var i = 2; i < 100; i++) {
    for (var j = 1; j <= i; j++) { // 把小于等于i的所有数都除一遍，整除两次以上就是质数
        if (i % j == 0) {
            count++
        }
    }
    if (count == 2) {
        console.log(i);
    }
    count = 0; // 最后计数要清零，下次继续
}

2. 引用值

array object function date RegExp

2.1. array

var arr = [1, 2, 3, 4];

// 一维数组以索引的方式取值，从0开始
console.log(arr[0])

// 赋值
arr[3] = null;

// 取长度
console.log(arr.length);

// 遍历，取每一位
for(var i = 0; i < arr.length; i++) {
  console.log(arr[i])
}

2.2. object

var person = {
  // 属性名/键名: 属性值/键值
  name: 'tom',
  age: 18,
  height: 100,
  weight: 140
}

// 取值
console.log(person.name);

// 赋值
person.age = 20;

3. typeof ⭐

3.1. 使用

typeof(123); // number
typeof('123'); // string
typeof (true); // boolean
typeof ({}); // object   这里的object是引用类型，不是对象
typeof ([]); // object   引用类型返回的都是object，除了function
typeof (null); // object   这里的object是一个bug
typeof (undefined); // undefined    
typeof (function(){}); // function

3.2. 注意点

object 代表引用类型，Object 代表具体对象 [object Object]
除了function，其它引用类型都是 object
null也是对象
typeof 返回的是字符串

3.3. 问题

3.3.1. null 是原始值，为什么 typeof(null) 是 object

null 刚开始是为了指定空对象，实际上是一个指空对象的指针，也是空对象的占位符，所以最早开始将其作为引用类型，后来有人提议将其类型改为null，但被ECMA拒绝了，属于历史遗留问题

3.2.2 typeof 一个未被定义的变量

console.log(a); // 报错：a is not defined
typeof a; // undefined typeof未被定义的变量返回 undefined
typeof(typeof(a)) // string 任何的typeof出来在进行typeof都是string

3. 类型转换 ⭐

3.1. 显示类型转换

3.1.1. Number

把对象的值转换为数字

var a = '123';
typeof (Number(a)), Number(a); // number 123
var a = 'true';
typeof (Number(a)), Number(a); // number NaN
var a = true;
typeof (Number(a)), Number(a); // number 1
var a = false;
typeof (Number(a)), Number(a); // number 0
var a = null;
typeof (Number(a)), Number(a); // number 0
var a = '';
typeof (Number(a)), Number(a); // number 0
var a = undefined;
typeof (Number(a)), Number(a); // number NaN
var a = a;
typeof (Number(a)), Number(a); // number NaN
var a = 'a';
typeof (Number(a)), Number(a); // number NaN
var a = '1a';
typeof (Number(a)), Number(a); // number NaN
var a = '3.14';
typeof (Number(a)), Number(a); // number 3.14

3.1.2. parseInt

把值转换成整形，数字开头的字符串可以转成数字

true false null undefined NaN -> NaN

使用

typeof parseInt('123'); // 123  
typeof parseInt(true); // NaN 不转布尔值
typeof parseInt(false); // NaN
typeof parseInt(null); // NaN
typeof parseInt(undefined); // NaN
typeof parseInt(NaN); // NaN
typeof parseInt('3.14'); // 3     
typeof parseInt('3.99'); // 3
typeof parseInt('123abc'); // 123
typeof parseInt('abc123'); // NaN

参数

parseInt(a, radix)

radix：以 n 进制为基础转换为 10 进制（n 范围：2-32）

// '10' 被当做 2 进制数，然后转换成10进制
console.log(parseInt('10', 2)); // 2

// '10' 被当做 16 进制数，然后转换成10进制
console.log(parseInt('10', 16)); // 16

数值进制的表示 ⭐
1. 16进制 —— 0x
2. 8进制 —— 0o
3. 2进制 —— 0b
4. 其它都是10进制

通过这些前缀或者 parseInt 可以把相应进制转成 10 进制，通过toString可以把 10 进制转成目标进制

3.1.3 parseFloat

可解析一个字符串，并返回一个浮点数

toFixed 保留小数四舍五入

var num = parseFloat('3.1415926')
console.log(num.toFixed(2)); // 保留小数后两位 四舍五入

3.1.4. String

console.log(String(123)); // '123'
console.log(123 + ''); // '123'

3.1.5. toString

使用

var str = 3.14;
str.toString(); // 123 

var str = undefined
str.toString(); // 报错

var str = null
str.toString(); // 报错

参数

toString(radix)

radix：以 10 进制为基础转换为目标进制

// '100' 被当做 2 进制数，转换成 10 进制，再转成 16 进制
console.log(parseInt('100', 2).toString(16)); // 4

3.1.6. Boolean

虚值(falsey)：通过Boolean转换为false的值

其中 null undefined NaN ‘’ 0 false 都是 false，其他的都是true

Boolean(1); // true
Boolean(null); // false
Boolean(undefined); // false

Boolean(new Error()) // true
Boolean([]) // true

3.2. 隐式类型转换

3.2.1. 算数运算符

+ number 转 string

- * / % string 转 number

var a = '123';      
a++; // Number(a)
console.log(a); // 124

var a = 'a' + 1; // String(1)        
console.log(a); // a1

var a = '3' * 2; // Number(3)    
console.log(a); // 6   

var num = '123';
console.log(typeof (+ num), +num); // number 123
console.log(typeof (- num), -num); // number -123

var num = 'abc';
console.log(typeof (+ num), +num); // number NaN
console.log(typeof (- num), -num); // number NaN

+undefined; // NaN
+null; // 0

3.2.2. 比较运算符

> < >= <= == === != != String -> Number

var a = '1' > 2; // Number(a)
console.log(a); // false

var a = 1 > '2'; // Number(a)
console.log(a); // false

var a = 'a' > 'b'; // 两个字符串比较时转换为 ascii 码比较
console.log(a); // false

var a = 1 == '1'; // Number(a)
console.log(a); //true

var a = 1 != '2'; // Number(a)
console.log(a); //true

var a = 1 === '1'; // === 不会隐式转换 不转换数据类型
console.log(a); // false

var a = NaN == NaN; // NaN不等于任何东西
console.log(a); // false

var a = 2 > 1 > 3;  
console.log(a); // false

var a = 2 > 1 == 1;
console.log(a); // true

3.2.3. undefined、null

undefined和null除了彼此，不与任何值相等

var a1 = undefined > 0;
var a2 = undefined < 0;
var a3 = undefined == 0;
console.log(a1, a2, a3); // false false false  

var a1 = null > 0;
var a2 = null < 0;
var a3 = null == 0;
console.log(a1, a2, a3); // false false false

var a = undefined == null;
console.log(a); // true

var a = undefined === null; // 不是一个数据类型
console.log(a); // false

3.2.4. isNaN

isNaN 先经过 Number(值) 转换之后再判断是否是 NaN

isNaN(NaN); // true
isNaN(123); // false
isNaN('123'); // false
isNaN('a'); // true  Number('a') -> NaN
isNaN(null); // false  Number(null) -> 0
isNaN(undefined); // true  Number(undefined) -> NaN

4. 作业

for循环算出斐波那切数列第n位

斐波那切数列（黄金分割数列/兔子数列）

1 1 2 3 5 8 每一位都是前两位的和

var n = parseInt(window.prompt('请输入第几位'));
var a = 1, 
    b = 1,
    num;
if(n <= 0){
  num = '输入错误';
} else if(n <= 2) {
  num = 1;
} else {
  for(var i = 2; i < n; i++) {
    num = a + b;
    a = b;
    b = num;
  }
}
document.write(num);