JavaScript入门

简介: JavaScript入门

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)


8.前提是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)
        }

image.png


26.内部函数可以访问外部函数成员变量,但是外部函数无法访问内部函数成员变量

27.JavaScript中函数找查变量从自身开始由”内“向”外“找查,假设外部存在这个同名的函数变量,则内部函数会屏蔽外部函数的变量.

28.时间戳转化为标准时间console.log( new Date(1651737066639))


image.png


时间戳转化为本地时间console.log( new Date(1651737066639).toLocaleString())


image.png


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

image.png


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为选择器例如


image.png

<button id="btn" type="submit"></bitton>
$('#btn').click(function(){alert('hello')})
相关文章
|
3月前
|
前端开发 机器人 API
前端大模型入门(一):用 js+langchain 构建基于 LLM 的应用
本文介绍了大语言模型(LLM)的HTTP API流式调用机制及其在前端的实现方法。通过流式调用,服务器可以逐步发送生成的文本内容,前端则实时处理并展示这些数据块,从而提升用户体验和实时性。文章详细讲解了如何使用`fetch`发起流式请求、处理响应流数据、逐步更新界面、处理中断和错误,以及优化用户交互。流式调用特别适用于聊天机器人、搜索建议等应用场景,能够显著减少用户的等待时间,增强交互性。
843 2
|
30天前
|
JavaScript 前端开发
【JavaScript】——JS基础入门常见操作(大量举例)
JS引入方式,JS基础语法,JS增删查改,JS函数,JS对象
|
2月前
|
机器学习/深度学习 自然语言处理 前端开发
前端神经网络入门:Brain.js - 详细介绍和对比不同的实现 - CNN、RNN、DNN、FFNN -无需准备环境打开浏览器即可测试运行-支持WebGPU加速
本文介绍了如何使用 JavaScript 神经网络库 **Brain.js** 实现不同类型的神经网络,包括前馈神经网络(FFNN)、深度神经网络(DNN)和循环神经网络(RNN)。通过简单的示例和代码,帮助前端开发者快速入门并理解神经网络的基本概念。文章还对比了各类神经网络的特点和适用场景,并简要介绍了卷积神经网络(CNN)的替代方案。
407 1
|
2月前
|
监控 前端开发 JavaScript
React 静态网站生成工具 Next.js 入门指南
【10月更文挑战第20天】Next.js 是一个基于 React 的服务器端渲染框架,由 Vercel 开发。本文从基础概念出发,逐步探讨 Next.js 的常见问题、易错点及解决方法,并通过具体代码示例进行说明,帮助开发者快速构建高性能的 Web 应用。
131 10
|
2月前
|
数据采集 存储 JavaScript
如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
本文介绍了如何使用Puppeteer和Node.js爬取大学招生数据,并通过代理IP提升爬取的稳定性和效率。Puppeteer作为一个强大的Node.js库,能够模拟真实浏览器访问,支持JavaScript渲染,适合复杂的爬取任务。文章详细讲解了安装Puppeteer、配置代理IP、实现爬虫代码的步骤,并提供了代码示例。此外,还给出了注意事项和优化建议,帮助读者高效地抓取和分析招生数据。
108 0
如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
|
4月前
|
JavaScript 前端开发 小程序
一小时入门Vue.js前端开发
本文是作者关于Vue.js前端开发的快速入门教程,包括结果展示、参考链接、注意事项以及常见问题的解决方法。文章提供了Vue.js的基础使用介绍,如何安装和使用cnpm,以及如何解决命令行中遇到的一些常见问题。
161 5
一小时入门Vue.js前端开发
|
3月前
|
存储 JavaScript 前端开发
前端开发:Vue.js入门与实战
【10月更文挑战第9天】前端开发:Vue.js入门与实战
|
3月前
|
自然语言处理 JavaScript 前端开发
JavaScript高级——ES6基础入门
JavaScript高级——ES6基础入门
42 1
|
3月前
|
机器学习/深度学习 自然语言处理 前端开发
前端大模型入门:Transformer.js 和 Xenova-引领浏览器端的机器学习变革
除了调用API接口使用Transformer技术,你是否想过在浏览器中运行大模型?Xenova团队推出的Transformer.js,基于JavaScript,让开发者能在浏览器中本地加载和执行预训练模型,无需依赖服务器。该库利用WebAssembly和WebGPU技术,大幅提升性能,尤其适合隐私保护、离线应用和低延迟交互场景。无论是NLP任务还是实时文本生成,Transformer.js都提供了强大支持,成为构建浏览器AI应用的核心工具。
783 1
|
3月前
|
Web App开发 JSON JavaScript
深入浅出:Node.js后端开发入门与实践
【10月更文挑战第4天】在这个数字信息爆炸的时代,了解如何构建一个高效、稳定的后端系统对于开发者来说至关重要。本文将引导你步入Node.js的世界,通过浅显易懂的语言和逐步深入的内容组织,让你不仅理解Node.js的基本概念,还能掌握如何使用它来构建一个简单的后端服务。从安装Node.js到实现一个“Hello World”程序,再到处理HTTP请求,文章将带你一步步走进Node.js的大门。无论你是初学者还是有一定经验的开发者,这篇文章都将为你打开一扇通往后端开发新世界的大门。

热门文章

最新文章