JavaScript（一）-白红宇的个人博客

JavaScript（一）

发布日期：2022-02-01 14:28:07 浏览次数：36 分类：技术文章

本文共 4161 字，大约阅读时间需要 13 分钟。

JS简介

HTML定义了网页的内容，CSS描述了网页的布局，JavaScript控制了网页的行为。

属于网络脚本语言。

用于设计，验证表单，检测浏览器，创建cookies

可插入html页面的编程代码

JavaScript：写入HTML输出

document.write("This is a heading
");

JavaScript：对事件作出反应

alert()函数不常用，但代码测试方便

JavaScript：改变HTML内容

x=document.getElementById("demo")  //查找元素，这个方法是HTML DOM中定义的，Document Object Modelx.innerHTML="Hello JavaScript";    //改变内容

JavaScript：改变 HTML 图像

点击灯泡来点亮或熄灭这盏灯

JavaScript：改变 HTML 样式

x=document.getElementById("demo")  //找到元素x.style.color="#ff0000";  # 改变样式

JavaScript：验证输入

if isNaN(x) {
   alert("Not Numeric")};

JS实现

HTML中脚本必须位于 <script> 与 </script> 标签之间。脚本可被放置在 HTML 页面的<body> 和<head> 部分中。JS会在页面加载时执行

外部JavaScript，外部文件是.js。外部脚本不能包含<script>标签

JavaScript输出

JS没有打印或输出函数。通过以下方法显示数据：
- window.alert() 弹出警告框
- document.write() 将内容写入HTML文档中
- innerHTML 写入到HTML元素
- console.log() 写入到浏览器控制台

操作HTML元素

JavaScript 由 web 浏览器来执行。在这种情况下，浏览器将访问 id=“demo” 的 HTML 元素，并把它的内容（innerHTML）替换为 “My First JavaScript”。

写到文档输出

JS语句

分号：分号用于分隔 JavaScript 语句。

顺序执行

JavaScript 代码块：JavaScript 语句通过代码块的形式进行组合。块由左花括号开始，由右花括号结束。

大小写敏感

忽略空格

可以在文本字符串中使用反斜杠对代码行进行换行

JavaScript 是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。

注释

//注释

/* 多行注释*/

变量

变量必须以字母开头

变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）

变量名称对大小写敏感（y 和 Y 是不同的变量）

var 声明变量

弱类型语言，变量数据类型根据值决定。

一条语句，多个变量。

var name="Gates", age=56, job="CEO";

JavaScript数据类型

字符串，数字，布尔，数组，对象，Null，Undefined

只有一种数字数据类型。前缀为"0"为八进制，为"0x"为十六进制

var x1=34.00，x2=34，y=123e5，z=123e-5

数组：var cars=new Array(); cars[0]=“Audi”;

或者：var cars=new Array(“Audi”,“BMW”,“Volvo”);

或者：var cars=[“Audi”,“BMW”,“Volvo”];

对象由花括号分隔，在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔

var person={
   firstname:"Bill", lastname:"Gates", id:5566};

对象属性有两种寻址方式：
- name=person.lastname;
- name=person[“lastname”];

Undefined 这个值表示变量不含有值。

可以通过将变量的值设置为 null 来清空变量。cars=null;

当您声明新变量时，可以使用关键词 “new” 来声明其类型：

var carname=new String;var x=      new Number;var y=      new Boolean;var cars=   new Array;var person= new Object;

JavaScript 变量均为对象。当您声明一个变量时，就创建了一个新的对象。

JavaScript对象

JavaScript中所有事物都是对象：字符串、数字、数组、日期，等等。

对象拥有属性和方法。
- 属性是与对象相关的值。
- 方法是能够在对象上执行的动作。

在 JavaScript 中，对象是数据（变量），拥有属性和方法。字符串对象同时拥有若干个内建的方法。

var txt="Hello";txt.length=5txt.indexOf()txt.replace()txt.search()

创建JavaScript对象

person=new Object();person.firstname="Bill";person.lastname="Gates";person.age=56;person.eyecolor="blue";person={
   firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};

使用对象构造器来构造对象

function person(firstname,lastname,age,eyecolor){
   this.firstname=firstname;this.lastname=lastname;this.age=age;this.eyecolor=eyecolor;this.changeName=changeName;function changeName(name){
   this.lastname=name;}}var myFather=new person("Bill","Gates",56,"blue")

访问对象属性的语法是：objectName.propertyName

访问对象的方法:objectName.methodName()

var message="Hello world!";var x=message.toUpperCase();

JavaScript类

JavaScript是面向对象的语言，但JavaScript不使用类。JavaScript基于prototype，而不是基于类的。

JavaScript for…in语句循环遍历对象的属性。

var person={
   fname:"Bill",lname:"Gates",age:56};for (x in person)  {
     txt=txt + person[x];  }

JavaScript 函数

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

函数就是包裹在花括号中的代码块，前面使用了关键词 function

function functionname(){
   这里是要执行的代码}

当调用该函数时，会执行函数内的代码。
可以在某事件发生时直接调用函数（比如当用户点击按钮时），并且可由 JavaScript 在任何位置进行调用。

调用带参数的函数

myFunction(argument1,argument2)function myFunction(var1,var2){
   这里是要执行的代码}# 变量和参数必须以一致的顺序出现。

带有返回值的函数

function myFunction(){
   var x=5;return x;}var myVar=myFunction();document.getElementById("demo").innerHTML=myFunction();function myFunction(a,b){
   if (a>b)  {
     return;  }x=a+b}

局部 JavaScript 变量

在 JavaScript 函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它。（该变量的作用域是局部的）。
您可以在不同的函数中使用名称相同的局部变量，因为只有声明过该变量的函数才能识别出该变量。
只要函数运行完毕，本地变量就会被删除。

全局 JavaScript 变量

在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。

JavaScript 变量的生存期

JavaScript 变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。

向未声明的 JavaScript 变量来分配值

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

JavaScript运算符

JavaScript 算术运算符
算术运算符用于执行变量与/或值之间的算术运算。
给定 y=5，下面的表格解释了这些算术运算符：

运算符	描述	例子	结果
+	加	x=y+2	x=7
-	减	x=y-2	x=3
*	乘	x=y*2	x=10
/	除	x=y/2	x=2.5
%	求余数（保留整数）	x=y%2	x=1
++	累加	x=++y	x=6
--	累减	x=--y	x=4

JavaScript赋值运算符
赋值运算符用于给 JavaScript 变量赋值。
给定 x=10 和 y=5，下面的表格解释了赋值运算符：

运算符	例子	等价于	结果
=	x=y		x=5
+=	x+=y	x=x+y	x=15
-=	x-=y	x=x-y	x=5
*=	x*=y	x=x*y	x=50
/=	x/=y	x=x/y	x=2
%=	x%=y	x=x%y	x=0

用于字符串的+运算符
如果是把数字与字符串相加，结果将成为字符串。

转载地址：https://blog.csdn.net/shunjianxaioshi/article/details/118543726 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！

上一篇：MS SQL用ROWCOUNT解决TOP子句不支持变量的问题

下一篇：HTML（一）

发表评论

关于作者

喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！

-- 愿君每日到此一游！