210113-JS(2)

1.JavaScript 变量提升
JavaScript 只有声明的变量会提升,初始化的不会。
以下两个例子结果不一样

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="demo"></p>
<script>
var x = 5; // 初始化 x
var y = 7; // 初始化 y
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = x + " " + y;           // 显示 x 和 y
</script>
</body>
</html>

输出:5 7
示例2:

var x = 5; // 初始化 x

elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = x + " " + y;           // 显示 x 和 y

var y = 7; // 初始化 y

输出:x 为:5,y 为:undefined
⚠️注意:
使用匿名函数的方式不存在函数提升,因为函数名称使用变量表示的,只存在变量提升。

var getName=function(){//这里不被提升
  console.log(2);
}

function getName(){
  console.log(1);
}

getName();
//结果为2

2.严格模式声明
严格模式通过在脚本或函数的头部添加 use strict表达式来声明。
3.JavaScript 字符串分行
字符串断行需要使用反斜杠()
4.checkValidity() 方法
HTMLSelectElement.checkValidity() 会检查元素是否有任何输入约束条件,并且检查值是否符合约束条件。
如果值是不符合约束条件的,浏览器就会在该元素上触发一个可以撤销的 invalid 事件。
该函数里面有两个值,默认判断值为 ture,可以修改为 flash。

document.getElementById("demo").innerHTML = inpObj.validationMessage;

其中XX.validationMessage用于反馈错误信息
5.Validity 属性
在这里插入图片描述
用法:
用于if语句的条件判断:

 if (document.getElementById("id1").validity.对应属性)
 {
 }

举例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>

<p>输入数字并点击验证按钮:</p>
<input id="id1" type="number" min="100" required>
<button onclick="myFunction()">验证</button>

<p>如果输入的数字小于 100 ( input 的 min 属性), 会显示错误信息。</p>

<p id="demo"></p>

<script>
function myFunction() {
    var txt = "";
	var inpObj = document.getElementById("id1");
	if(!isNumeric(inpObj.value)) {
		txt = "你输入的不是数字";
	} else if (inpObj.validity.rangeUnderflow) {
        txt = "输入的值太小了";
    } else {
        txt = "输入正确";
    }
    document.getElementById("demo").innerHTML = txt;
}

// 判断输入是否为数字
function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
}
</script>

</body>
</html>

6.循环作用域/let关键字
使用了 var 关键字,它声明的变量是全局的,包括循环体内与循环体外。

var i = 5;
for (var i = 0; i < 10; i++) {
    // 一些代码...
}
// 这里输出 i 为 10

使用 let 关键字, 它声明的变量作用域只在循环体内,循环体外的变量不受影响。

var i = 5;
for (let i = 0; i < 10; i++) {
    // 一些代码...
}
// 这里输出 i 为 5

let 关键字在不同作用域,或不同块级作用域中是可以重新声明赋值的:
1.

let x = 2;       // 合法
{
    let x = 3;   // 合法
}
{
    let x = 4;   // 合法
}
let x = 2;       // 合法
let x = 3;       // 不合法
{
    let x = 4;   // 合法
    let x = 5;   // 不合法
}

7.JSON数据
JSON 语法规则:

数据为 键/值 对。
数据由逗号分隔。
"name":"Runoob"

大括号保存对象,对象可以保存多个 键/值 对:
{"name":"Runoob", "url":"www.runoob.com"}
方括号保存数组
"sites":[
    {"name":"Runoob", "url":"www.runoob.com"}, 
    {"name":"Google", "url":"www.google.com"},
    {"name":"Taobao", "url":"www.taobao.com"}
]

JSON 字符串转换为 JavaScript 对象

//1.首先,创建 JavaScript 字符串
var text = '{ "sites" : [' +
'{ "name":"Runoob" , "url":"www.runoob.com" },' +
'{ "name":"Google" , "url":"www.google.com" },' +
'{ "name":"Taobao" , "url":"www.taobao.com" } ]}';
//2.使用 JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象:
var obj = JSON.parse(text)
//3.在你的页面中使用新的 JavaScript 对象:
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值