JS基础语法

1js的引入方法

1.直接在行内插入js代码

<a href="javascript:alert('你好');">你好</a>

<div οnclick="alert('11111')">你好</div>

<span οnclick="alert('你好')">你好</span>

<p class="p1">鼠标悬浮</p>

2. 在body结束标签的后面添加js代码

<script>在此处写js代码</script>

3.在head标签里面添加js代码

必须要添加 window.onload ,当页面加载完毕之后再执行js

4.引入外部js代码

<script src="./js/one.js"></script>

2.js的输出方式

1.弹窗输出

alert('hello world');

2.页面输出

//document.write('hello world');

document.write('<h1>hello world</h1>');

document.write('<div>hello<span> world</span></div>');

('') 里面添加内容的,叫做方法

= '' 后面添加内容的,叫做属性

3.控制台输出

控制台输出是给程序员（开发者）看的错误信息，不是给用户看的页面中不显示

console.log('香蕉苹果');

3.js的命名方式

var uname = 'jack';

var userName = 'jack';

console.log(userName);

console.log(uname);

4.变量

1.创建变量的方式

1. var 变量名 = 值    var uname = 'jack';

2. 变量名 = 值  uname = 'rose';

3.  var 变量名;(变量的声明）    变量名 = 值; （ 赋值）  注意:如果只是声明了一个变量,但是没有给这个变量赋值,输出的时候,就是undefined age = 18;

4.var 变量1=值1，变量2=值2，变量3=值3 ( 三个变量都会声明前置) console.log(num); console.log(num2); console.log(num3); var num=10,num2=20,num3=30;

5.赋值运算符:将等号右边的值,赋值给等号的左边 uname = 'jack'; console.log(uname);

3.特点

1)当没有var的时候,直接输出uname,会报错,uname is not defined

2)一旦出现错误,后面的代码将会被阻止,因为js是单线程的

3) 带有var的变量,会声明前置[优先执行var uname]

console.log(uname);	uname is not defined uname没有被定义
uname = 'jack'; console.log(uname);	上面有错误

5.字符串类型

1. 只要用引号包裹起来的就是字符串(双引号,单引号)

        var name = '小李';

        var age = "20";

        console.log(name,age);

        console.log(typeof name);

        console.log(typeof(age));

2. 双引号里面不能写双引号,单引号里面不能写单引号

        var say = "你好'javascript'";

        var say = '你好"javascript"';

        var say = "你好\"javascript\"";

        console.log(say);

3. 可以添加转义字符

        var str = "我想要换行\n换行之后的内容";

        document.write(str);

        alert(str);

4. 字符串中的特殊符号 +

 注意:只要+两边,有任意一个是字符串类型,那么+就是字符串拼接的作用

        console.log(1+'hello');

        console.log(1+'100');

        var str = 'jack';

        console.log(str + 100);

5. 所有的变量只要用引号包裹起来,就会变成字符串

        console.log('str' + 100);

6.数字类型

1. 进制表示数字

        二进制 0b

        八进制 0

       十六进制0x

        最终输出的时候,一定是十进制

        var num1 = 0b1010101;

        console.log(num1);

2. 整型和浮点型

        var num1 = 10.5;

        console.log(typeof num1);

 3. number类型(number,NaN[not a number])

        任何一个NaN和另外一个NaN,永远不相等

        console.log(typeof 10);

        console.log(10 - 'a');

 4. toFixed(小数点后的位数) 保留小数点后的位数

        特点:四舍五入

        console.log(0.158);

        console.log(0.158.toFixed(2));

5. 浮点数是一个近似值，所以,有时候得到的并不是我们期待的结果

         console.log(0.1+0.2);

         console.log(1-0.9);

6. parseInt 得到一个整型,没有四舍五入

     parseFloat 得到一个浮点型

     console.log(parseInt(25.123));

     console.log(parseInt(25.623));

     console.log(parseFloat(25.623));

     console.log(parseFloat(25));

7.undefined-null-boolean

 undefined 未定义

1. 定义了一个变量但没有为该变量赋值，使用了一个并未赋值的变量

           var str;

           console.log(str);

 2. 使用了一个不存在的对象的属性时

         （1）天生有对象

            使用js自带的对象,日期事件,字符串,数组....

         （2） 没有对象,创建对象

             创建,new Object    字面量的方式创建

3.null 空值

        var str = '';

        var str1 = null;

        var newObject = null;

        newObject = 123

4. Boolean

        真 true(除了下面的7中情况,其他的都是真)

        假 false("",'',0,0.0,null,undefined,flalse)

        var str = '';

        var str = "";

        var str = 0.0;

        var str = null;

        var str = undefined;

        var str = false;

        判断的时候使用

案例：

        var num = 10;

        var num2 = 30;

        console.log(num > num2);  假的

        console.log(num < num2);  真的

 var str = [];

 if(str){  当()内容为真的时候,执行{}中的代码

            console.log('真');

        }else{  当()内容为假的时候,执行{}中的代码

            console.log('假');

        }

8.数组

array 可以放多个值的数据类型创建

         （1）类 - 实例化对象 - 对象

            var arr = new Array();

            var arr2 = new Array();

            arr2[0] = '小李';

            arr2[3] = '大李';

            console.log(arr2);

            var arr = new Array("祥符区","鼓楼区","龙亭区");

            console.log(arr);

          （2) 使用[]创建(使用的最多的,最方便)

            var arr1 = ["开封","新乡","郑州"];

            console.log(arr1);

           获取里面的值

            0,1,2 数组的键/下标

            var arr1 = ["开封","新乡","郑州"];

            console.log(arr1);

            console.log(arr1[0]);“开封” 注意：第一个从0开始

            console.log(arr1[1]);“新乡”

            console.log(arr1[2]);“郑州”

          多维数组

            var arr1 = [

            [['祥符区','杞县','尉氏县'],'新乡','郑州'],

            ['昆山市','吴江区','吴中区'],

            ['浦东新区','闵行区','徐汇区']

             ];

            console.log(arr1[1][2]); “吴江区”

            console.log(arr1[0][0][0]);“祥符区”

9.严格模式

同样的代码，在"严格模式"中，可能会有不一样的运行结果；一些在"正常模式"下可以运行的语句，在"严格模式"下将不能运行。

       "use strict";

        x = 3.14;

        console.log(x);

10.数据

1.基础数据类型:

            栈内存: 堆书的过程,压栈,先进后出

            这个值就是放在栈中的

2.引用数据类型:

            堆内存: 数组

            值是放在堆中的,但是内存地址是放在栈

           var arr1

           arr1 = ['a','b','c'];

           var arr2 = arr1;

           arr1[1] = 'box'; 

          console.log(arr1);

           console.log(arr2);

数组赋值之后,当其中一个值发生改变,另外一个值,会跟着发生改变

11.对象

注意：JS中一切皆对象

创建对象

（1）使用 Object

var cat = new Object();

 -- 属性 -- 

cat.name = '富贵';

cat.color = '灰色';

cat.brand = '美短';

 -- 方法 -- 

cat.eat=function(){

console.log('吃饭');

}

cat.drunk=function(){

console.log('喝酒');

 }

（2）自变量方式

对象里面有什么东西:

            属性:本身所具有,形容词

            方法:能做的事情,动词

var Dog = {

           --  属性 --

            'name':'大黄',

            'age':2,

           --方法--

            'eat':function(){    

           -- 在对象的方法中调用属性,this.name

              console.log('我叫'+this.name+'我喜欢吃肉');

              name 指的是,对象外面的name变量-- 

              console.log('我叫'+name+'我喜欢吃骨头');

            },

            'drunk':function(){

            console.log('吃肉');

            }

        }

console.log(Dog);

        --  调用 -- 

       --  console.log(Dog.name); 调用属性  -- 

       -- Dog.eat();  调用方法 -- 

        console.log(Dog['name']);  --  调用属性 -- 

        var a = 'name';

        console.log(Dog[a]);

        console.log(Dog.a);

       

        注意:调用属性和方法的时候,.后面不能识别变量

                当我们使用[]的时候,可以[]中添加变量