JavaScript从放弃到入门（一）| JS基本语法

最新推荐文章于 2024-05-11 21:19:51 发布

去海边钓猪

最新推荐文章于 2024-05-11 21:19:51 发布

阅读量127

点赞数 1

分类专栏： JS 文章标签： javascript js

本文链接：https://blog.csdn.net/super1223/article/details/117766540

版权

JS 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

前言

Javascript简称js，js是一种脚本语言，是不需要进行编译的，也是浏览器中的一部分，经常用在web客户端脚本语言，主要是用来给html增加动态功能。

js的组成是有三部分组成，包括基本的语法和文档对象模型，以及浏览器对象模型。

1 js引入位置

在页面中直接嵌入

<script>
    var a = 1;
    alert(a);
</script>

通过src引入其他文件夹文件资源
```
<script src="/login/main"></script>
```

通过link链接外部资源（内部其他文件也可）

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>

2 JavaScript数据类型和变量

其实js作为java的一种简化语言，很多地方语法结构和java并没有特别大的区别。作为后端开发人员，我们只需要熟练掌握利用js来为处理数据和渲染数据到页面上即可。

2.1 数据类型

Number

JavaScript不区分整数和浮点数，统一用Number表示，以下都是合法的Number类型

123; // 整数123 
0.456; // 浮点数0.456 
1.2345e3; // 科学计数法表示1.2345x1000，等同于1234.5 
-99; // 负数 
NaN; // NaN表示Not a Number，当无法计算结果时用NaN表示 
Infinity; // Infinity表示无限大，当数值超过了JavaScript的Number所能表示的最大值时，就 表示为Infinity

字符串

用单引号或者双引号包裹起来的都称为字符串。
```
‘a’
“abc”
```

布尔型

布尔型分为false或者true

true&&false
false
true&&true
true
false&&false
false

比较运算符
```
>   //小于
<   //大于
=   //等于
```
== //自动转换类型来比较，不是真正的等于

=== //不会自动转换类型
```
1 == “1”
true
1 === “1”
false
```
NaN：这个特殊的Number与所有其他值都不相等，包括它自己
```
NaN === NaN
false
isNaN(NaN)
true
```
null表示一个“空”的值，它和 0 以及空字符串 '' 不同，
- 0是一个数值，
- ''表示长度为0的字符串，
- 而 null 表示“空”。
undefined表示一个未定义的值。

数组

var a = [1,'s',true,null，person]    //可以放任何数据类型
a[0]        //通过下标访问
1

对象

var person = {      //通过键值对格式存储
  name: "张三",
  age: 12
}；
person.name         //通过对象.属性格式获取
"张三"

2.2 变量类型与作用域

JavaScript有两种变量类型

全局变量：var 在任何地方都可以定义，有全局作用域也有函数作用域。

var a=1  //定义全局
function test(){
    b=1;  //定义全局
    var c=1  //定义局部
}
test();
a
1
b
1
c
undefined

局部变量：let 只可以在函数作用域中定义并生效。
```
for(let i = 1; i<10;i++){console.log(i);}
```
注意：如果一个变量没有声明就被赋值，那他将是自动声明为全局变量。

2.2.1 关于var作用域提升

function test () {
    console.log(a);  //undefined
    var a = 123; 
};
test()
undefined

虽然没有定义a就使用a但是它的内部执行顺序是这样的

function test () {
    var a;
    console.log(a);  //undefined
    a = 123; 
};

a = 1;
var a;
console.log(a); 
1

输出为一，是因为每次js都为将变量的声明提升到作用域顶端

2.2.2 经典案例-变量提升

console.log(v1);
var v1 = 100;
function foo() {
    console.log(v1);
    var v1 = 200;
    console.log(v1);
}
foo();
console.log(v1);

输出为：

undefined
undefined
200
100

注意：在函数内和函数外定义的变量并不是同一个，这点和java类似。

2.3 strict模式

为了解决JavaScript的随意性，可以是用strict来对JavaScript的语法进行检查。

只需要在js的头部加上'use strict'就可以对之下的代码进行一个较为严格的语法检查了。

'use strict';

关于更多的数据类型的操作不在这里进行记录。

3 函数

作为一门

3.1 定义和使用函数的方式

可以直接写函数和函数名

function a1(ss){
    console.log(ss)
    }

a1("ok")
ok

也可以直接把函数赋值给变量

var a1 = function (ss){
    console.log(ss)
    }

al("ok")
ok

当只声明了一个变量，传入多个参数时，语法检测并不会报错，只会显示未定义。

a1(1,2)
1
undefined

3.2 特殊的关键字

arguments

arguments只在函数内部起作用，并且永远指向当前函数的调用者传入的所有参数。这样就可以通过下标的方式拿到那些未定义的参数。

function a1(s) {
    for (let i=0; i<arguments.length; i++){
        console.log("i==="+arguments[i]);
    }
}

a1(1,2,1)
1
2
1

3.3 方法

方法就是定义在对象里面的函数

方法的定义和使用

var person = {
        name: "张三",
        age: 12,
        study: function () {
            console.log(this.name+"爱学习")
        }

person.name
"张三"
person.study()
张三爱学习

也可以通过将他们分离开来

var student = {
        name: "李四",
        age: 12,
        habbit: study
    }
function study() {
    console.log(this.name+"也爱学习")
}

student.habbit()

有的时候，我们希望通过一个方法来获取不同对象的属性。我们可以这样做

var person = {
        name: "张三",
        age: 12,
    }
    var student = {
        name: "李四",
        age: 12,
    }
    function study() {
        console.log("我是"+this.name+",今年"+this.age)
    }

study.apply(person)
我是张三,今年12

通过方法的.apply()实现对this指针的重定向。

去海边钓猪

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript从放弃到入门（一）| JS基本语法

前言Javascript简称js，js是一种脚本语言，是不需要进行编译的，也是浏览器中的一部分，经常用在web客户端脚本语言，主要是用来给html增加动态功能。js的组成是有三部分组成，包括基本的语法和文档对象模型，以及浏览器对象模型。1 js引入位置在页面中直接嵌入 <script> var a = 1; alert(a);</script> 通过src引入其他文件夹文件资源 <script src="/login/...
复制链接

扫一扫