JavaScript中一些简单的知识

目录

0.码仙励志

1.alert();  弹框

2.console.log();  在控制台输出

3.WebStorm  常用快捷键

4.typeof  获取变量类型

5.常用的类型转换

1.parseInt();  转整数

2.pasreFloat();  转小数

3.Number();  转数字

4.Boolean();  转布尔类型

6.NaN  不是一个数字

7.undefined  未定义

8.prompt();  输入框

9.document.write();  在浏览器页面中显示

10.定义数组的方式

11.arguments  伪数组

12.instanceof  判断对象类型

13.disabled   禁用 input 元素

14.阻止超链接跳转

15.confirm   确定及取消按钮的对话框

16.onload  页面加载完毕触发 

17.bind(对象)  改变函数执行时this的指向


0.码仙励志

如果你看到面前的阴影,别怕,那是因为你的背后有阳光

1.alert();  弹框

用法:

<script>
    alert("天生我才必有用");
</script>

2.console.log();  在控制台输出

用法:

<script>
    console.log("天生我才必有用");
</script>

3.WebStorm  常用快捷键

  1. CTRL+Alt+L  格式化代码
  2. Alt+F12  快速打开浏览器
  3. Alt+鼠标左键  批量修改代码
  4. CTRL+鼠标左键  查看函数的用法

4.typeof  获取变量类型

用法:

<script>
    var a = 10;
    var b = "bb";
    console.log(typeof a);
    console.log(typeof b);
</script>

5.常用的类型转换

1.parseInt();  转整数

用法:

<script>
    var a = "12";
    var b = "a12";
    var c = "12a";
    var d = "1a2";
    console.log(parseInt(a));
    console.log(parseInt(b));
    console.log(parseInt(c));
    console.log(parseInt(d));
</script>

2.pasreFloat();  转小数

<script>
    var a = "1.2";
    var b = "a1.2";
    var c = "1.2a";
    var d = "1.2a2";
    console.log(parseFloat(a));
    console.log(parseFloat(b));
    console.log(parseFloat(c));
    console.log(parseFloat(d));
</script>

3.Number();  转数字

<script>
    var a = "1.2";
    var b = "12";
    var c = "1.2a";
    var d = "a12";
    console.log(Number(a));
    console.log(Number(b));
    console.log(Number(c));
    console.log(Number(d));
</script>

4.Boolean();  转布尔类型

<script>
    console.log(Boolean(2));
    console.log(Boolean(1));
    console.log(Boolean(0));
    console.log(Boolean(-1));
    console.log(Boolean(-2));
</script>

6.NaN  不是一个数字

用法:

<script>
    console.log(isNaN(5));
    console.log(isNaN("5"));
    console.log(isNaN("Hello"));
</script>

7.undefined  未定义

用法:

定义一个变量,没有赋值,就是undefined

<script>
    var a;
    console.log(a);
</script>

8.prompt();  输入框

用法:

<script>
    var age = prompt("请输入年龄");
    console.log(age);
</script>

9.document.write();  在浏览器页面中显示

<script>
    document.write("天生我才必有用");
    document.write("<a style='color: red'>千金散尽还复来</a>");
</script>

10.定义数组的方式

<script>
    var arr1 = [];
    var arr2 = new Array();
</script>

参数:

1.new Array();
2.new Array(size);
3.new Array(element0, element1, ..., elementn);
  1. 参数 size 是期望的数组元素个数。返回的数组,length 字段将被设为 size 的值。
  2. 参数 element ..., elementn 是参数列表。当使用这些参数来调用构造函数 Array() 时,新创建的数组的元素就会被初始化为这些值。它的 length 字段也会被设置为参数的个数。

11.arguments  伪数组

可以当作数组使用

<script>
    function f1() {
        var sum = 0;
        for (var i = 0; i < arguments.length; i++) {
            sum = sum + arguments[i];
        }
        return sum;
    };
    //可以自动获取参数的值和个数
    console.log(f1(10, 20, 30));
    console.log(f1(10, 20, 30, 40, 50));
</script>

12.instanceof  判断对象类型

语法:对象  instanceof  类型的名字 

<script>
    var date = new Date();
    var arr = new Array();
    console.log(date instanceof Date);
    console.log(arr instanceof Array);
    console.log(date instanceof Array);
    console.log(arr instanceof Date);
</script>

13.disabled   禁用 input 元素

  1. 被禁用的 input 元素既不可用,也不可点击。
  2. disabled 属性无法与 <input type="hidden"> 一起使用。
<body>
<input type="text">
<input type="text" disabled="disabled">
</body>

 

14.阻止超链接跳转

 点击超链接后不能正常跳转

<body>
<a href="https://www.baidu.com" onclick="return false">百度</a>
</body>

15.confirm   确定及取消按钮的对话框

confirm() 方法用于显示一个带有指定消息和 OK 及取消按钮的对话框。

<script>
    var flag = confirm("是否继续");
</script>

点击确定,flag的值就是true;点击取消,flag的值就是flase;

16.onload  页面加载完毕触发 

因为onload事件在页面加载完毕后才触发,所以不会报错

<body>
<script>
    window.onload = function () {
        document.getElementById("btn").onclick = function () {
            alert("码仙");
        };
    };
</script>
<input type="button" value="按钮" id="btn"/>
</body>

17.bind(对象)  改变函数执行时this的指向

<body>
<input type="button" value="按钮1" id="btn1">
<input type="button" value="按钮2" id="btn2">
<script>
    document.getElementById("btn1").onclick = function () {
        console.log(this.id);//btn2
    }.bind(document.getElementById("btn2"))
</script>
</body>

猜你喜欢

转载自blog.csdn.net/tswc_byy/article/details/82682028