前端——JavaScript基础

最新推荐文章于 2021-10-20 13:08:38 发布

一言難盡

最新推荐文章于 2021-10-20 13:08:38 发布

阅读量100

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/weixin_42752314/article/details/93387885

版权

JavaScript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

JavaScript简介

JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

JavaScript 是一种轻量级的编程语言。是可插入 HTML 页面的编程代码。JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。JavaScript 很容易学习。

如何用JavaScript

要在html页面中插入JavaScript，要使用

<script>  
	//弹窗输出“hello”  
	alert("hello");
	</script>

也可以新建一个js文件，然后在html页面中使用，把JavaScript代码放入一个单独的js文件中更利于维护代码，并且多个页面可以各自引用同一份js文件。

JavaScript输出

JavaScript本身没有任何打印或者输出的函数。

JavaScript可以通过下面方法输出数据：

使用window.alert()弹窗输出，可以直接用alert()；
使用console.log()输出到浏览器的控制台。
```
console.log("hello");
```
使用document.write()方法吧内容写到HTML文档中。
```
document.write("hello");
```
使用innerHTML写到HTML元素中

　　　　document.getElementById("a").innerText = "你好啊";

注意事项：

document.write()输出时会调用Object.toString方法，所以为对象时会输出[Object],而console.log()会直接将对象内容打印出来。所以调试的时候，调用console.log()比较好，少用document.write()方法。

在JavaScript中操作HTML元素

如果需要在JavaScript中访问某个HTML元素，可以使用document.getElementById(id) 等方法。id要在HTML目标元素中定义。例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    
</head>
<body>

<input id ="a" >
    
<script>
        document.getElementById("a").innerHTML="abc";
    </script>

</body>
</html>

JavaScript基本语法

JavaScript语法和Java语言比较相似，语句以；结尾，语句块用中括号{ }。虽然JavaScript并不强求语句结尾加；，浏览器执行JavaScript时会自动在结尾加上；，但是养成良好的编码习惯，还是应该自己加上；。

JavaScript赋值语句

var a =123；
var b = 1.11；
var c = '嗨';
var d = "hello";
var e = true;

因为JavaScript语法相对比较随意，所以也可以这样：

a = 123；
"hello"

注释

单行注释

以//开头直到行尾的字符会被视为行注释，JavaScript不会执行注释内容。

多行注释/* */

/*这是注释第一行
    这是第二行
    这是第三行*/

注意事项：

JavaScript对大小写敏感，所以编写代码时要注意。

数据类型和变量

数据类型

JavaScript的数据类型

undefined (变量没有初始值时，将会被赋予值undefined)
null （表示一个空值）
number （表示数值）
JavaScript不区分整数和浮点数。
NaN：Not a Number ，无法计算出结果时用NaN表示
Infinity：表示无限大的数，当数值超过了JavaScript的Number所能表示的最大值时，用Infinity表示。
boolean （表示布尔类型）
布尔值只有 true和false两个值，可以用布尔运算计算出值为 true或false。
string （表示被引号括起来的文本）
字符串可以用双引号" "或者单引号’ ‘括起来，比如’abc’,“hello”。

变量

先声明变量再赋值
例如：var width；
width = 100；
同时声明和复制变量
例如：var name = “Jack”;
var a,b = 3;
不声明直接赋值( 这种方式不建议使用)
例如：a = 1;

Typeof运算符

typeof返回的值包括：undefined, null, bool, number, string, object, function，都是字符串类型。
null: typeof(null) 返回 “object”, 但null并非object, 具有 null 值的变量也并非object。未定义的返回"undefined"
number: typeof(NaN) 和 typeof(Infinity) 都返回 number; NaN参与任何数值的计算结果都是NaN,且 NaN != NaN, Infinity / Infinity = NaN

String对象

属性
字符串对象.length
例如str.length 表示字符串的长度
方法
字符串对象.方法名
常用的方法有：
- charAt（index）
  返回在指定位置的字符，index数值代表字符串指定字符的下标。
- IndexOf（str，index）
  查找某个指定的字符串在字符串中首次出现的位置。
- substring（index1，index2）
  返回回位于指定索引index1和index2之间的字符串，[index1,index2)。
- split（str）
  将字符串分割为字符串数组。

数组

创建数组
var 数组名称 = new Array（size）
为数组元素赋值
var a = new Array(); a[0] = “元素1”; a[1] = “元素2”;
var a = new Array(){“元素1”, “元素2”};
var a = new Array(“元素1”,“元素2”);
删除数组
delete 数组名;
数组操作
数组名.length; //获取数组元素的个数；返回大于或等于0的整数
数组名.toString(); //返回由逗号(,)连接数组元素组成的字符串。
数组名.join(); //把数组的各元素由一个分隔符连接起来作为字符串；与字符串的split功能刚好相反
数组名.sort（）； //给数组排序
数组名.push(); //向数组末尾添加一个或更多元素，并返回新的长度。

运算符号

类型	运算符
算术运算符	+ - * / % ++ - -
赋值运算符	= += -=
比较运算符	> < >= <= == != === !==
逻辑运算符	&& !

=== 和==是不同的，==是两个值先转化成同一类型再看值是否相等，而 ===如果类型不同，其结果就是不等。

逻辑控制语句

if条件语句
if(…){…} else{…}
if 语句允许不使用else子句，允许进行嵌套
switch多分支语句
switch(表达式){
case 值1:
语句1;break;
case 值2:
语句2;break;
default:
语句3;
}
for、while循环语句
for (初始化;条件;增量)
{ 语句1;
… }

while (条件)
{ 语句1; … }
for-in
for(var key in objs)
{var element=objs[key];…}
注意: in 前面的是 key,而不是下标或者集合里面的元素,获取集合里的元素要使用集合[key]

中断控制

break
跳出循环
continue
跳过本次循环，进入下一次循环。

函数

函数的含义：类似于Java中的方法 , 是完成特定任务的代码语句块。分为系统函数和自定义函数。

常用的系统函数
parseInt (“字符串”)；
将字符串转换为整型数字，如: parseInt (“86”)将字符串“86“转换为整型值86。
parseFloat(“字符串”)；
将字符串转换为浮点型数字，如: parseFloat(“34.45”)将字符串“34.45“转换为浮点
值34.45。
isNaN()；
用于检查其参数是否是非数字。
自定义函数
- 定义函数
  使用 function 指令定义。其属性用“this.属性名”定义。
  如：function ObjectName(yName,yAge) {
  this.name = yName;
  this.age = yAge;
  }
  调用时：
  var myObject = new ObjectName(“kk”,80); // ObjectName 里面的函数会被执行
  document.write("name = " + myObject.name + "
  age = " + myObject.age);
- 调用无参函数
  例如：onclick =“study()”
- 调用有参函数
  例如：οnclick=“study(a)”
- 变量的作用域
  全局变量：不在任何函数内定义的变量就具有全局作用域。实际上，JavaScript默认有一个全局对象window，全局作用域的变量实际上被绑定到window的一个属性。
  局部变量：如果一个变量在函数体内部申明，则该变量的作用域为整个函数体，在函数体外不可引用该变量。

一言難盡

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端——JavaScript基础

JavaScript简介JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。JavaScript 是一种轻量级的编程语言。是可插入 HTML 页面的编程代码。JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。JavaScript 很容易学习。如何用JavaScript要...
复制链接

扫一扫