JavaScript之入门1篇（基本语法）

最新推荐文章于 2024-06-13 14:30:24 发布

这蛆烫头了

最新推荐文章于 2024-06-13 14:30:24 发布

阅读量137

点赞数

分类专栏：学习记录 JavaScript 文章标签： javascript

原文链接：https://www.bilibili.com/video/BV1Sy4y1C7ha?p=194&spm_id_from=pageDriver

版权

学习记录同时被 2 个专栏收录

26 篇文章 0 订阅

订阅专栏

JavaScript

7 篇文章 2 订阅

订阅专栏

学习记录：

学习视频链接：https://www.bilibili.com/video/BV1Sy4y1C7ha?p=194&spm_id_from=pageDriver

1、JavaScript介绍：

1、JavaScript是运行在客户端的脚本语言（script是脚本的意思）

脚本语言：不需要编译，运行过程中由js解释器（js引擎）逐行解释并执行

2、js组成：

JavaScript语法
DOM（页面文档对象模型）
BOM（浏览器对象模型）

3、JavaScript的书写位置

行内式

<body>
    <input type="button" value="唐伯虎" onclick="alert('秋香姐')" />
</body>

内嵌式

<head>
    <title>js</title>
    <script>
        alert('哈喽')
    </script>
</head>

外部js
1、新建.js文件夹，编写js代码/
2、链接js文件

<head>
    <title>js</title>
    <script src="my.js"></script>
</head>

4、JavaScript输入输出语句

方法	说明
alert	浏览器弹出警示框
console.log(msg)	浏览器控制台打印输出信息
prompt（info）	浏览器弹出输入框，用户可以输入

5、JavaScript的数据类型

JavaScript是一种弱类型或者说动态语言，也就是说不用提前声明变量的类型，在程序运行过程中，类型会自动被确定

js把数据类型分为两类

简单数据类型（Number，String，Boolean，Underfined，null）
复杂数据类型（object）

简单数据类型说明：

简单数据类型	说明	默认值
Number	数字型，包含整型值和浮点型值，如21、0.21	0
String	布尔型值，true，false等价于1和0	false
Boolean	字符串类型，如“张三”，js中，字符串都带引号	“”
Underfined	var a；声明了变量a但是没有给值，此时a=undefined	undefined
Null	var a=null；声明了变量a为空值	null

特殊字符：

转义符	说明
\n	换行符，n 是 newline 的意思
\	斜杠\
’	'单引号
‘’	''双引号
\t	tab缩进
\b	空格，b 是 blank 的意思

6、数据类型转换

转换为字符串：

方式	说明	案例
toString	转成字符串	var num=1；alert（num.toString()）;
String（）强制转换	转成字符串	var num=1；alert（String(num)）;
加号拼接字符串（隐式转换）	和字符串拼接的结果都是字符串	var num=1；alert（num+“我是字符串”）;

转换为数字型：

方式	说明	案例
parseInt（string）函数	将string类型转换成整数数值类型	parseInt（‘78’）
parseFloat（String）函数	将string类型转换成浮点数数值类型	parseFloat（‘78.21’）
Number（）强制转换函数	将string类型转换成数值类型	Number（‘12’）
js隐式转换（- * /）	利用算术运算隐式转换为数值型	‘12’-0

转换成布尔型：

方式	说明	案例
Boolean（）函数	将其它类型转换成布尔类型	Boolean（‘true’）

‘’、0、NaN、null、undefined会被转换成false，其余为true

7、JavaScript的基础方法

isNaN（）：用来判断非数字，并返回一个值。如果是数字返回false，否则返回true

    <script>
        console.log(isNaN(12))
    </script>

typeof：用于检测变量的数据类型

    <script>
        var str = 10;
        console.log(typeof str);
    </script>

8、字面量

字面量是在源代码中一个固定值的表示法，通俗来说，就是字面量表示如何表达这个值。

数字字面量：8, 9, 10
字符串字面量：‘黑马程序员’, “大前端”
布尔字面量：true，false

9、变量和函数

变量的使用：
eg：声明一个名称为age的变量（关键字var）

var age;

函数的使用：

函数的两种声明方式
1、通过命名函数

function 函数名（）{   //声明函数
	//函数体
}
函数名（）;           //调用函数

2、通过函数表达式

var 变量名 = function（）{  //声明函数
     //函数体
}
变量名（）;                //调用函数

10、对象

创建对象的三种方式：
1、通过对象字面量创建对象
eg：

var obj = {
	uname:'张三',
	age:18,
	sex:'男'
	sayHi:function(){
		console.log('hi~');
	}
}

2、通过new Object创建对象
eg：

var obj = new Object();
obj.uname = '张三';
obj.age = 18;
obj.sex = '男';
obj.sayHi = function(){
	console.log('hi~');
}

3、通过构造函数创建对象

	<script>
        // 利用构造函数创建对象
        // 我们需要创建四大天王的对象  相同的属性： 名字 年龄 性别  相同的方法： 唱歌
        // 构造函数的语法格式
        // function 构造函数名() {
        //     this.属性 = 值;
        //     this.方法 = function() {}
        // }
        // new 构造函数名();
        function Star(uname, age, sex) {
            this.name = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function(sang) {
                console.log(sang);

            }
        }
        var ldh = new Star('刘德华', 18, '男'); // 调用函数返回的是一个对象
        // console.log(typeof ldh);
        console.log(ldh.name);
        console.log(ldh['sex']);
        ldh.sing('冰雨');
        var zxy = new Star('张学友', 19, '男');
        console.log(zxy.name);
        console.log(zxy.age);
        zxy.sing('李香兰')



        // 1. 构造函数名字首字母要大写
        // 2. 我们构造函数不需要return 就可以返回结果
        // 3. 我们调用构造函数 必须使用 new
        // 4. 我们只要new Star() 调用函数就创建一个对象 ldh  {}
        // 5. 我们的属性和方法前面必须添加 this
    </script>

11、内置对象的使用（arguments）

当我们不确定有多少个参数传递的时候，可以用arguments来获取。在JavaScript中，arguments实际上它是当前函数的一个内置对象。所有函数都内置了一个arguments对象，arguments对象中存储了传递的所有实参。

	<script>
        // arguments 的使用  只有函数才有 arguments对象  而且是每个函数都内置好了这个arguments
        function fn() {
             console.log(arguments); // 里面存储了所有传递过来的实参  arguments = [1,2,3]
             console.log(arguments.length);
             console.log(arguments[2]);
            // 我们可以按照数组的方式遍历arguments
            for (var i = 0; i < arguments.length; i++) {
                console.log(arguments[i]);
            }
        }
        fn(1, 2, 3);
        fn(1, 2, 3, 4, 5);
        // 伪数组 并不是真正意义上的数组
        // 1. 具有数组的 length 属性
        // 2. 按照索引的方式进行存储的
        // 3. 它没有真正数组的一些方法 pop()  push() 等等
    </script>

这蛆烫头了

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript之入门1篇（基本语法）

学习记录：学习视频链接：https://www.bilibili.com/video/BV1Sy4y1C7ha?p=194&spm_id_from=pageDriver1、JavaScript介绍：1、JavaScript是运行在客户端的脚本语言（script是脚本的意思）脚本语言：不需要编译，运行过程中由js解释器（js引擎）逐行解释并执行2、js组成：JavaScript语法DOM（页面文档对象模型）BOM（浏览器对象模型）3、JavaScript的书写位置行内式
复制链接

扫一扫