JavaScript入门

二两相思酿

已于 2022-08-26 15:17:18 修改

阅读量813

点赞数

分类专栏： JavaScript 文章标签： javascript 前端开发语言

于 2022-05-07 15:15:48 首次发布

本文链接：https://blog.youkuaiyun.com/qq_45720234/article/details/124552559

版权

JavaScript 专栏收录该内容

2 篇文章

订阅专栏

1.在html中“<script></script>”必须成对出现不能自闭合，否则代码无法生效.
2.在JavaScript中== 等于(类型不一样，值一样也会返回true);=== 绝对等于(类型一样，值一样结果为true);
3.NaN===NaN 返回false与所有的数值都不相等包括自己
4.尽量避免浮点数进行运算，存在精度问题
5.null空，undefined未定义
6.var arr=[1,2,3,4,'hello',null,true];定义数组可以储存不同类型的值，new array(1,2,3,'hello');也可以实现，但是为了保证代码可读性建议使用前者
7.对象是大括号，数组是中括号

var person={
name:"peng",
age:3,
sex:"男"}
/*通过以下方式可以取值*/
console.log(person.name)
console.log(person.age)
console.log(person.sex)

前提是IDEA支持ES6，"use strict"严格检查模式，预防JavaScript的随意性出错，而且必须写在第一行
9.模板字符串
==`==这个点是Tab上面那个

let name ="penggege";
let age = 3;
let msg=`你好，${name}`;
/*可以通过这种方式进行拼接*/

10.JavaScript字符串有不可变性，大小写转换，是个方法不是属性
student.toUpperCase()转换为大写
student.toLowerCase()转换为小写
11.substring[num,num);与slice()效果一样包含第一个不包含第二个
12.数组长度arr.length可以赋值，但是多出来的位置未定义undefined
13.push()向数字内增加元素压入到尾部，pop()从尾部向外弹元素(删除元素)
14.unshift()压入到头部shift()弹出头部的元素
15.排序arr.sort() 反转arr.reverse()
16.concat()拼接数组，原数组不会改变会生成一个新的数组
17. 连接字符join打印数组使用特定字符拼接

["A","B","C"]
arr.join('-')
"A-B-C"

18.多维数组与Java相同
19.动态增删属性，通过delete删除对象的属性

delete person.name

动态添加直接赋予即可

person.haha=“haha”

20.hasOwnProperty()判断属性值是否是自身拥有属性
21.for循环与Java一致，forEach遍历输出需要借助函数

arr.forEach(function(value){console.log(value)})

22.Map与Java一样都是以键值对的方式存值

var  map=new Map([['tom',10],['jack',100],['ok',1000]])
map.set(['admin',123])//向map内添加值

23.Set无序不重复集合
24.arguments:是一个关键字，代表传递进函数的所有参数形成一个数组这个数组就是arguments

function T(x){
for(var i=0;i<arguments.length;i++){
console.log(arguments[i])
}
}
T(1,2,3,4,5,6,7,8,9);
//可以遍历出所有传进来的参数，但是由于第一个参数也存在arguments中所以数字要从1开始也就是第二个下标开始

25.ES6新引入rest可以直接接受后面的参数必须用...标志识

        function abs(x,...rest) {
         console.log(rest)
        }

在这里插入图片描述
26.内部函数可以访问外部函数成员变量，但是外部函数无法访问内部函数成员变量
27.JavaScript中函数找查变量从自身开始由”内“向”外“找查，假设外部存在这个同名的函数变量，则内部函数会屏蔽外部函数的变量.
28.时间戳转化为标准时间console.log( new Date(1651737066639))
在这里插入图片描述
时间戳转化为本地时间console.log( new Date(1651737066639).toLocaleString())

29.对象转化为json字符串,json字符串转化为对象

var user={name:"peng",age:3,sex:'男'}
//对象转化为json字符串{"name":"peng","age":20,"sex":"男"}
var jsonUser=JSON.string(user);
//json转化为对象{name:"peng",age:20,sex:'男'}
var obj=JSON.parse('{"name":"peng","age":20,"sex":"男"}')

30.location代表当前页面的URL信息

location.assign("URL")//转向这个url

在这里插入图片描述
32. 获得Dom节点

var h1=document.getElementsByTagName('h1');//设置name属性
var p1=document.getElementsById('p1');//设置id属性
var p2=document.getElementsByClassName('p2');//设置class属性
var father=document.getElementsById('father');
//father.firstChild
//father.lastChild

33.表单判断用户名是否为空

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="https://www.baidu.com/" method="post" onsubmit="return login()"style="text-align: center">
   <p><input type="text" name="username" id="username"></p>
    <p> <input type="password" name="password" id="password"></p>
    <button type="submit">提交</button>
</form>
</body>
<script>
    function login() {
        let name=document.getElementById("username").value;
        let password=document.getElementById("password").value;
        if(name!=""&&password!=""){
            return true
        }else {
            alert("用户名密码不能为空")
            return false
        }

    }
</script>
</html>

34.jQuery选择器
①可使用CDN引入: https://www.jq22.com/cdn/进去直接复制JavaScript标签引入
②去官网下载 https://jquery.com/download/直接下载js文件引入
初识公式：${selector}.action()
工具站不会可查https://jquery.cuishifeng.cn/
其中selector为选择器例如
在这里插入图片描述

<button id="btn" type="submit"></bitton>
$('#btn').click(function(){alert('hello')})