JavaScript基础 - 技术栈

JavaScript是什么

简称JS，作为开发Web页面的脚本语言而出名，是一个脚本语言，解释型或即时编译型的编程语言。

JS和CSS，HTML之间的关系

HTML : 网页的结构

CSS ：网页的外貌（表现）

JS ：网页的行为

上手示例：

复制代码

    <script>
        alert("hello JS")
    </script>

JS的引入方式

跟 CSS 一样，JS的引入方式有三种

行内样式：

直接写到 html 内部

内部样式：

定义<script>标签写到 script 标签中

外部样式：

定义<script> 标签，通过 src 属性引入外部 js 文件

变量

var：

作用域在该语句的函数内

let：

作用域在该语句所在的代码块内

const：

声明常量使用，声明后不可修改

注意：

JS 是动态弱类型语言，变量可以存放不同类型的值：

复制代码

    <script>
        let a = 10;
        let b = "love";
        a = "you";
        b = 520;
    </script>

会发生隐式的类型转换

变量名命名规则：

组成字符可以是字母，数字，下划线或者美元符号

数字不能开头

建议使用驼峰命名

表示字符串拼接

\n 表示换行

数据类型：

number：数字（不区分整数和小数）

string：字符串类型（需要用引号引起来，单引号双引号都可以）

boolean：布尔类型

undefined：变量未初始化，值为 undefined

JS对象

数组

创建方式：

复制代码

        var arr= new Array();
        var arr= [];
        var arr= [1,2,"hello"];

（数组存放元素不用同一类型）

函数

复制代码

        function 函数名(参数){
            方法内容;
        }
        function add(a,b){
            return a+b;
        }

调用函数：

复制代码

add(参数);
add(a,b);

（如果实参数量大于形参，则多出来的参数不参与运算）

（如果形参的数量大于实参，其他形参默认为 undefined）

对象

创建对象：

复制代码

        let student = {
            name: "张三",
            age: 18,
            saylove :function(){
                console.log("love you");
            }
        }

对象属性的调用

复制代码

        let student = {
            name: "张三",
            age: 18,
            saylove :function(){
                console.log("love you");
            }
        }
        console.log(student.name);
        student.saylove();

使用 new object 创建对象

复制代码

        let student = new Object();
        student.name="李四";
        student.age=28;
        student.saylove=function(){
            console.log("love you")
        }
        console.log(student.name);
        student.saylove();

使用构造方法构造对象：

复制代码

        function CreatStudent(){
            this.name="王五"
            this.SayLove=function(){
                console.log("love you")
            }
        }
        let student = new CreatStudent();
        console.log(student.name);
        student.SayLove();