js查漏补缺

最新推荐文章于 2022-01-06 23:27:52 发布

上天肖

最新推荐文章于 2022-01-06 23:27:52 发布

阅读量158

点赞数

分类专栏：基础查漏补缺文章标签： js javascript

本文链接：https://blog.csdn.net/xiaoshixiu/article/details/88405842

版权

基础查漏补缺专栏收录该内容

27 篇文章 0 订阅

订阅专栏

1、对象类型：var person = {firstName:"John", lastName:"Doe"}; // Object 通过对象字面量赋值

2、函数表达式可以存储在变量中：
实例
var x = function (a, b) {return a * b};
var z = x(4, 3);

3、函数是对象
unction myFunction(a, b) {
return a * b;
}

var txt = myFunction.toString();

4、模块化
CommonJS规范：(同步，主要用于服务器)
①模块引用
假定有一个数学模块math.js
var math = require('math');
然后，就可以调用模块提供的方法：
var math = require('math');
math.add(2,3); // 5
②模块定义
export
③模块标识
module

AMD(RequireJS)规范：（异步，主要用于浏览器）
①定义模块：
define("math",['dependency'],function(){
return{
};

});

ES6规范：
加载模块：
import myModule,{printFullName} frm 'myModule.js'
myModule.printName();
printFullName('a');
6、冒号

等于等号"="
cla1={
    a:"va1",
    b:"va2"
};

cla1.a;//调用

cla2={
    getValue:function(){}
}
cla2.getvalue();

7、使用var与不使用var
使用var表示当前作用域，不使用var表示全局作用域

8、Promise

CommonJS中提出的用链式操作替代嵌套操作，其实就是一种语法糖。

console.log('开始做饭。');

    new Promise(function(resolve, reject){

        setTimeout(function(){

            console.log('做饭完毕！');

            resolve('鸡蛋炒饭');//reject("没炒好");

        }, 1000);

    }).then(function(data){

    console.log('开始吃饭：' + data);

}，

function(data){

    console.log('不吃了，' + data);

}

)

9、Jquery

jquery作为一个js库文件，可以嵌入到web工程中作为一个工具，主要可以在选择元素时使用更简单的语法来表达，比如：

<body>

        <button id="_btn1">bt1</button>

        <textarea id="_ta1">tx1</textarea>

        <p id="_p1">p1</p>

    </body>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.js">
        
</script>
<script>
    $("#_btn1").click(function(){

            $("#_ta1").hide();

        });
</script>

10、JS this指针

①，对于类构造函数

1、当没有使用new创造新对象时，对象或者函数里面的this执行window。

2、当使用new创建新对象时，this执行这个新对象。

<script>
        var age1=10;
        $("#_btn1").click(function(){
            $("#_ta1").hide();
        });
        function People(age,sex,height){
            this.age1=age;
            this.sex=sex;
            this.height=height;
        }
        console.log("oput:"+this.age1);//10
        function ondomready() {  
            var xiaoming=new People(12,"man",160);
            console.log("ondomready"+window.age1);//如果上面用new，则输出10，上面不用new，则输出12
            $("#_p1").html("people"+xiaoming);
        }
        $(document).ready(ondomready);
    </script>

②，对于对象的方法调用，有两种情况

1、对象方法最外层this指向对象

2、对象方法里面的function指向全局

var value=456;//global
aa={
    testfunc:function(){
        console.log(this.value);//123
        a=function(){
            console.log(this.value);//456
        }
    },
    value:123 //local
};
aa.testfunc();

//123
//456

11、JS 创建对象

1、JS可以不通过类直接创建对象

var person = {firstName:"John", lastName:"Doe"};

2、如果要创建类，有以下方法

function People(age,sex,height){
            this.age1=age;
            this.sex=sex;
            this.height=height;
        }

12、JS Prototype

1、每个对象都有，通过对prototype添加属性和方法，这些属性和方法将成为拥有prototype的对象的属性和方法。通过这种特效，可以实现继承。

<!DOCTYPE html>
<html>
    <head></head>
    <body>
        <script type="text/javascript">
            function People(age,sex,height){
                this.age1=age;
                this.sex=sex;
                this.height=height;
                this.getHeight=function(){
                    return this.height;
                }
            }
            function Student(clazz){
                this.clazz=clazz;
            }
            Student.prototype=new People();
            var xiaoming=new Student(1);
            xiaoming.age1=12;
            xiaoming.sex="man";
            xiaoming.height=120;
            var xiaohong=new Student(2);
            xiaohong.age1=13;
            xiaohong.sex="woman";
            xiaohong.height=110;
            console.log("height:"+xiaoming.getHeight());//输出120
            console.log("height:"+xiaohong.getHeight());//输出110
        </script>
    </body>
</html>

13 Class与Extends

Class和Extends是在ES6中新增的关键字，用来模拟Java中对类的声明，其实是通过prototype实现的一种语法糖。

<!DOCTYPE html>
<html>
    <head></head>
    <body>
        <script type="text/javascript">

            class Food{
                constructor(price){
                    this.price=price;
                }
            }
            var food=new Food();
            food.price=10;
            console.log("food:"+food.price);//输出10

            class Verg extends Food{
                //如果要实现构造器则要调用super()
            }
            var verg= new Verg();
            verg.price=12;
            console.log("verg:"+verg.price);//输出12
        </script>
    </body>
</html>

14、With

with语句用得比较少，专业解释为：

with 语句用于设置代码在特定对象中的作用域。

举个栗子：

var b={};

b.x=1;

b.y=2;

with(b){

    console.log("x:",x);//输出1

}

15、JS 数组和字典

JS里面数组也是字典，举个栗子：

a=[];

a[0]=1;

a["xx"]=2;

console.log(a.xx);//输出2

16、null ,NaN,undefined差别

undefined:表示一个变量声明后没有定义，或者从一个对象中取未初始化的属性

例如：

//demo1
Var a;
console.log(a);//undefined


//demo2
Var a={};
b=a.x;
console.log(b);//undefined

注意，not defined ,表示变量未定义就使用

例如

b=a;//ReferenceError ,x is not defined

NaN:表示无法转化为数字的数据

例如：

b=1+undefined;
console.log(b);//NaN

null:表示变量定义为空值

a=null;
console.log(a);//null

上天肖

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js查漏补缺

1、对象类型：var person = {firstName:"John", lastName:"Doe"}; // Object 通过对象字面量赋值2、函数表达式可以存储在变量中：实例var x = function (a, b) {return a * b};var z = x(4, 3);3、函数是对象unction myFunction(a, b) { retur...
复制链接

扫一扫

专栏目录