从0开始学JS(三)循环、引用值、类型转换

110 阅读3分钟

重点:typeof、显示类型转换、隐式类型转换

一.循环

1.for循环

步骤:1.声明
2.if语句 看条件是否满足
3.执行语句
4.i++
5.走if语句 条件满足
6.执行语句
7.i++
8.if语句 不满足条件 循环结束

<script type="text/javascript">
var i=0
for( ;i<10; ){
console.log(i);
i++;                /for循环展开版/
}
</script>

2.死循环

<script type="text/javascript">
var i=0;
while(1){  
console.log(i);
i++    /条件永远满足就会死循环,本来会展现出1,2,3,4,5,······ 我的浏览器接卡死了 一直在跳转 属实拉跨/
}
</script>

3.break

break;直接结束整个循环;相当于中间直接填个false( 即for(;;)内中间的判断语句不成立 )

var i=1;
for(;i;i++){
console.log(i);
if(i<10){
i=0;      /这里相当于break,当i=0时 上面for中间的判断语句不成立,不会再++,终止循环/
}
}

4.continue相当于不填

continue:跳过当前循环,继续下一轮循环

<script>
/打印出100以内的数,除了可以被7整除的或个位数是7的数
for(var i=0;i<=100;i++){
if(i%7==0 && i%10==7){
   /此处不填就相当于填了continue/
  }else if{ console.log(i); }
}
</script>

5.面试题规律

(1)打印0-100的数,()内只有一句,不能写比较 且{ }内不能出现i++ 、 i--

<script>
for(var i=100;i--;){ /当i<0时自然会结束循环/
console.log(i);
}
</script>

(2)获取三位数的每一位数字

<scirpt>
var num=789;
var a=num%10;                   /个位数/
var b=(num - a)%100/10         /十位数/
var c=(num - a -b * 10)/100   /百位数/
</scirpt>

6.do{ }while( )

一般不怎么使用,因为无论判断语句是否对错,do内的语句一定会执行一次

二.引用值初始

1.数组array

数组的取值:使用索引的方式来取值,从0开始

<script>
var arr= [1,2,3,4,5,6,7];
console.log(arr[5]); //使用索引的方式来取值,从0开始
</script>

2.对象object

格式: 属性名:属性值

var person={
name:'小夏'// 属性名/键名:属性值/键值
}
console.log(person.name);   /输出为小夏  解释型语言一行行翻译/
person.name="小王"   
console.log(person.name);  / 输出为小王

三.类型转换

(1)typeof

<script>
/ typeof可打印的数据类型为:
/number string boolean undefined object、function
/ 引用类型(即引用值如array、object、function)暂时填大Object  具体实例填小o:object 

var a = {
  name:"xx"
}
console.log(typeof(a));//具体的对象a 返回object

/引用类型都返回object
 console.log(typeof({}));//object  
 console.log(typeof([]));//object  引用类型数组
 
/Object同时也是Function的实例对象 
  console.log(typeof(function(){}));//function 
  console.log(typeof( Object));//function  Object是对象?还是顶端的构造函数
  

   
console.log(typeof(null));//object
/null最早是指定空对象的指针 最早开始把它说成一个引用类型  历史遗留问题:懒得改了 

   /语法上面犯错的都返回undefined 如:
    console.log(typeof(a));//返回undefined  因为a没有被声明赋值
    console.log(typeof(undefine)); //返回undefined 
    
    console.log(typeof(function(){}));//返回function
    console.log(typeof("1a"));//返回string
       
    console.log(typeof(1-1));//number
    console.log(typeof(1-"1"));//number
    console.log(typeof("1"-"1"));//number
    console.log(typeof(NaN));//number
     console.log(typeof(9/0));//number
      
      /任何typeof出来的结果再typeof  一定为string  因为typeof后数据类型的名称为字符串
       console.log(typeof(typeof(a))); //string
       
       
</script>

思路总结

1.任何typeof出来的结果再typeof 一定为string 因为 typeof 后数据类型的名称为字符串
2.typefo可打印的数据类型为:number string boolean undefined object、function
3.引用类型都返回object,如[ ] 、 { }
4.null返回object
5.function、Object返回function
6.语法错误的、undefined都返回undefined
7.NaN返回number

function问题

函数也是一种特殊的对象。

(2)显示类型转换

明确告诉你要进行转换

  • number():转化为number类型
<script>
console.log(typeof(Number(123))+"-"+Number(123)) //输出 number - 123

/非数都转换为NaN
console.log(Number(undefined))//输出NaN  非数
/undefined 输出为NaNundefined为非数
console.log(Number("srt")) //输出 number - NaN 
/字符串转化为NaN,字符串为非数
console.log(Number("2a"))//输出NaN  非数
/字符串为非数

console.log(Number(true))//输出1
/布尔值转化为01

    / /数字加引号输出为数字 /
console.log(Number("555")) //输出555  

console.log(Number(null)) //输出  0
/null 输出为0

/parseInt把一个数转换成整形
  console.log(parseInt("123"));//123
  console.log(parseInt("true"));//NaN
  console.log(parseInt(true));//NaN
/ truefalseundefinedNaNnull 都转换成NaN

 console.log(parseInt('abc123'));//输出为NaN
 console.log(parseInt('123abc'));//输出为123
 /parseInt的一个特点:检测第一个数是否为数字,第一位不是数字的话NaN,直到看到不是数字的地方就放弃检测

console.log(parseInt(8,16));//输出为8  
                                         /代表以16进制为基础转换为十进制
console.log(parseInt('a',16));//输出10   //0123456789abcde

/parseFloat
        var num = parseFloat('3.1415926')
             /保持住小数点后两位
        console.log(num.toFixed(2)); //输出3.14
        var num = parseFloat('3.1465926')
        console.log(num.toFixed(2)); //输出3.15
        /会自动进行四舍五入
        
  /toString
  /undefinednull没有toString这个方法,会报错
  var str=null;
  console.log(str.toString());//ReferenceError
     
  var str='100';
   console.log(parseInt(str,2).toString(16))  //输出为4
   //将二进制为100的数转化成十进制的数4,将十进制的数4再转化成十六进制,结果为4
   
  /Boolean()
  console.log(Boolean([]));//true
  console.log(Boolean({}));//true
       console.log(Boolean(''));//false
  /undefined null NaN "" 0 falsefalse,其余皆为true
  
 
  /小知识:
  var a=1234;
  console.log(a.length);/ 输出undefined
  var a="1234";
  console.log(a.length);/输出4
  /length返回的是字符串的长度,1234不是字符串类型。另外   字符串中空格也算长度 如'1     2' 返回7(空格占五位)
</script>

思路总结

1.显示转换的函数: Number()、Boolean()、parseInt()、parseFloat()、toString()等
2. Boolean() : undefined null NaN "" 0 false 为false,其余皆为true
3. undefined、null没有toString这个方法,会报错
4. parseInt的一个特点:检测第一个数是否为数字,第一位不是数字的话NaN,直到看到不是数字的地方就放弃检测
5. parseInt: true、false、undefined、NaN、null等非数都转换成NaN

(3)隐式类型转换

偷偷的转换

<scirpt>
var a='123';
a++;
console.log(a);//输出为124
/这里悄悄做了Number(a),再++

var a='3'*2;
console.log(a);//输出为6
/  *、/、-、%这些都悄悄Number()了
总结:运算符基本上都会隐式类型转换

var a='1'>2;
console.log(a); //返回false
var a=1>'2' 
console.log(a); //返回false
/这些字符串都是悄悄的number()了


var a='a'>"b"; //返回false  /转化成ascii码进行比较
/ >、<、>=、<=都是悄悄进行了number()转换,再对比 
运算符基本上都会隐式类型转换

var a= 1==='1'; //返回false        /这个不进行隐式类型转换(首先比较,返回false了,不进行数据类型转换)
var a= NaN == NaN; //返回false

var a= 2>1>3; //返回false     2>1 返回true,true转为1 不大于3 返回false
var a2= 2>1 == 1; //返回true   2>1返回true,true==1成立   

var a= undefined ==0 //undefined >,<,== 0  都为false
var a= null ==0      //null   >,<,== 0  都为false  
                       //null、undefined既不小于0,又不等于0,也不大于0
var a= null == undefined   //true !!!!!   这是值相同?        
var a= null === undefined  //false  他们不是一个数据类型 
var a= NaN == NaN   //false    NaN不等于任何数

//隐式类型转换:无论数据之前是否有+ - ,都会把字符串转换成number类型
var num ='123';
console.log(typeof(-num) + ' : ' + - num);//返回  'number : -123'

//isNaN() 判断里面的东西是否为非数
//方法:number()后的值是不是NaN 
console.log(isNaN(NaN)) //true  
console.log(isNaN(undefined)) //true  number()转换undefined为NaN , 隐式转换

console.log(isNaN('a')) //true  /非数返回true
console.log(isNaN('2a')) //true

cconsole.log(isNaN('123')) //false  数字隐式转换成number后 不为非数
console.log(isNaN(null)) //false  number()转换null后的值为0,是数字

</script>

新发现 : 当没有运算符时 基本上不会隐式转换:

var a = 1;
console.log('a'); //返回a   灰色
console.log(a);  //返回1    蓝色
console.log(123); //123    蓝色
console.log('123');//123  灰色 证明它是字符串类型

思路总结

1.有运算符(+ - * / > < == != 等),且有数字类型参与时,基本都会隐式转换(没有运算符时基本上不会转换)('9'>'89' 因为此时没有数字参与)

2.字符串之间的大小比较,会转化为ASCII码进行比较。从第一位比较起。如'abc' < 'ad'
3. null == undefined
4. 2>1>3 , 2>1返回true , true转换为1 , 1>3, 返回false
5.isNaN() 会进行隐式转换,偷偷的Number(),非数的Number()后都返回NaN
6.好像隐式转换都是用Number
7. isNaN(null) 返回false , null : Number()后返回0
8. 9/0 输出Infinity, 即正无穷。 它的类型为number。所以 isNaN(9/0) 返回 false
9. NaN 不等于任何数,包括它自己

四.算法训练

斐波那契数列/黄金分割数列/兔子数列: 前两个数的和等于后一位,如:1 1 2 3 5 8.
要求用for()循环算出第n位
var n=parseInt(window.prompt('N=?'));

  <script type="text/javascript">
        /*斐波那契数列/黄金分割数列/兔子数列: 前两个数的和等于后一位,如:1 1 2 3 5 8.
         *要求用for()循环算出第n位
         *var n=parseInt(window.prompt('N=?'));    
        */

        var a = [1, 1];
        for (var i = 2; i < 100; i++) {
            a[i] = a[i - 1] + a[i - 2];

        }
      var n = parseInt(window.prompt("输入n的值"));
        console.log(a[n]);

五.难点

1. 隐式类型转换,非数字的都转化为NaN

  <script type="text/javascript">
  console.log(typeof("555"));//string类型
  console.log(Number("555"));//输出为555
  console.log(Number("aaa"));//输出为NaN
  /Number()会将所有数值类型都转换为number类型;转化完成后看里面的内容是否为数字,非数字都返回NaN
   console.log(typeof(NaN));/输出为number  NaN本身就是number类型
   
   /转化为number类型后 看里面的内容是否为数字,非数字都返回NaN
    console.log(Number('+'));//输出为NaN
  console.log(Number("a"));//输出为NaN
  console.log(Number("true"));//输出为NaN

2.length返回的是字符串的长度,返回不了其他类型的长度

<script>
  var a=1234;
  console.log(a.length);//输出undefined
  var a="1234";
  console.log(a.length);//输出为4
 /length返回的是字符串的长度,1234不是字符串类型。另外字符串中空格也算长度 如'1     2' 返回7(空格占五位)
  
  /居然不会隐式类型转换
 console.log('1233');/输出'1233'
/不做运算,单纯console.log()的情况下不会隐式类型转换
</script>

3. Object是原型顶端构造函数的名称,所以返回function

  console.log(typeof(Object)); //function
  console.log(typeof(object)); //undefined

object未被定义所以输出undefined。