html前端学习十一:javascript数据类型 运算符 循环

js六大数据类型

  1. Number —数字

  2. String — 字符串

  3. Boolean — 布尔

  4. function — 函数 函数名字加括号是执行函数

  5. undefined — 未定义 一个变量没有声明赋值就是undefined

  6. object — 对象 只有对象曾能去点方法点属性,数组也是对象

Number数字

在js里面的小数和整数
-2^53~~2^53,超出范围之后精度就不准确了

Number方法

Number() ------参数中必须能被转换成数字,否则返回NaN;

alert(typeof Number("50") );

结果:

number

parseInt(解析的参数) ----将转化为数字,整数部分遇到不是数字就停

var n = 5.564;
alert (parseInt(n));

结果:

5

parseFloat()-----将参数转为数字,直到小数部分遇到不是数字就停

var n = 5.564b2;
alert (parseFloat(n));

5.564

parseFloat()可将字符串转换为小数,
toFixed()保留几位小数

	var n = "998.568$";
	var result = parseFloat(n);

	alert(result.toFixed(2));

保留两位小数,结果为:

998.57
undefined
	var n = 1+ undefined;  //底层自动Number(undefined)
	alert(n);

result:

NaN
	var n = 1+ undefined;  
	alert(n==n);

result:

False

NaN(Not a Number)
所以 NaN不等于他自己

	var n;  
	alert(n==n);

undefined 等于undefined

Math数学函数

Math.pow(16,2)
16的平方

Math.round(0.52)
四舍五入到整数部分,答案为1

Math.ceil(9.1);
向上取整,如果有小数,9.1取整为10

Math.floor(8.9);
向下取整,如果有小数,8.9取整为8

Math.max(1,2,3,4,5,6,7,8,9);
去参数中最大的值

Math.min(1,2,3,4,5);
去参数中最小的值

var random = Math.random();
生成一个随机数,值域在0-1

var random = Math.random();
alert(random.toString().length); //求随机数的长度

返回一个0到50的随机数

random*50;

返回1到50的随机数

random*49+1;

Math.PI
π

string字符串

  • str[index];
  • str.charAt(index);
    通过索引取字符串
	var string = "this is new String";
	alert(string[0]);

result :

t
str[str.length-1]  //最后一个字符

支持IE9以下的取字符方式

str.charAt(0)
  • toString()
    可以将字符串 数字 函数(拼接的方式) 布尔 函数 转化为字符串
    空对象无法转化

  • substring()
    截取字符串 会比较从参数,值小的在前面 参数值为负数的时候,会变为0

    var str= "This is String";
	alert(str.substring(1, 5));	

只显示1到4的字符

his

等同于

alert(str.substring(5, 1));	
  • str.slice()
    切片 始终从左往右取字符,负数倒着数,不会交换参数位置
	var str= "This is String";
	alert(str.slice(-2, -1));

result:

n
  • str.split()
	var str= "This is String";
	alert(str.split(" "));	

以数组的形式返回 逗号分隔

    var str= "This is String";
	alert(str.split(" ")[2]);	
  • str.indexOf()
    查找字符串,成功就返回索引,没有成功返回-1
    从位移9开始寻找Slice
	var str = "This is Slice My name's Slice";
	alert(str.indexOf("Slice",9));

返回24
二次查找模式

alert(str.indexOf("Slice",str.indexOf("Slice")+1));
  • str.toUpperCase()
    全部转换大写

  • str.toLowerCase()
    全部转换小写

Boolean布尔值

true
false
当要判断一个值是否等于另一个值就会使用到布尔,因为只有两个值

  1. undefined
  2. null
  3. 0或-0
  4. NaN
  5. “”
    以上5个值在做"条件判断"的时候,条件都为假,其余都为真(true),包括对象(数组)
    Boolean转Number ==> true:1 false:0
alert(Number(true));
  • Null和undefined
  1. null == undefined 返回true 因为放在条件里面都为假 false == false
  2. null是一个关键字,类似于正确的空值填补,undefined是预先定义好的全局变量不是关键字,变量声明没有赋值也是undefined,值就是未定义,类似于错误的空值的填补
  3. null转number为0,undefined转number为NaN;
    1+ undefined =NaN;
    1+null =1;
  4. null的数据类型是对象(object),但是非对象。undefined数据类型就是undefined
  • Number(null) 值为0

null==undefined 两者之间是相等的

=== 三个等于号表示恒等于,值也相等

数组
var arr = [1,2,3,4,"This is Python",true,function(){alert(1)},{},undefined,null];
  • Array.isArray(arr) 如何判断数组
alert(Array.isArray(arr));
  • arr.join(""); 数组拼接,整体转换为字符串
undefined

没有任何方法的

关于script在head标签内填写的注意事项

需要时有window.onload = function(){}包裹内部标签

//当页面所有的节点元素、图片、文字内容、全部加载完成之后执行function的代码
<script>
	window.onload = function(){
	var box = document.getElementById("box");
	alert(box);	
	}
</script>
</head>

<body>
    <div id="box"></div>
</body>

运算符

+ - * / %(求余数)

  • 赋值操作
    = += -= /= *= %= ++ –
  1. 能被计算才会执行计算,否则会出现各种各样的问题 NaN Error
  2. 值与值之间相加,只要其中有一个字符串则就是字符串拼接
  3. 布尔值计算的时候 true = 1; false = 0;
  4. -*/% 强制转换数字进行计算。

var a=30;
var b = a++; 先赋值在自增
a为31
b为30

var c = ++a;先自增在赋值
a为31
c为31

条件判断符号

        undefined
        null
        ""
        0
        NaN
        < > == <= >=  !=不等于    ===恒等于(还会判断数据类型)     !== 不全等

逻辑运算符

逻辑运算符

            && || !
            与 或 非
            和 或 取反
        与:
            遇到假就停,返回false
        或:
            遇到真就停,返回true

循环


<body>

    
    <ul id="list">
        <li>1111</li>
        <li>2222</li>
        <li>3333</li>
        <li>4444</li>
        <li>5555</li>
        <li>6666</li>
    </ul>

    <ul>
        <li>111</li>
    </ul>



<script>
    var list = document.getElementById("list");
    var lis = list.getElementsByTagName("li");

    // lis[0].onclick = function() {
    //     alert(this.innerHTML);
    // }
    // lis[1].onclick = function() {
    //     alert(this.innerHTML);
    // }
var i=0
    for(; i<lis.length; ) {
        lis[i].index = i;
        lis[i].onclick = function() {
            // 循环完了的i
            alert(this.index+1+ "======" + this.innerHTML);
        }
        i++
    }

    // for(var i=0; 99<100; i++) {
    //     console.log(i);
    // }

    // for(var x=100; 100<100; x++) {
    //     console.log(99);
    // }



</script>

</body>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值